@univerjs/docs-drawing-ui 0.2.3 → 0.2.4

package/lib/es/index.js

@@ -1,144 +1,144 @@
-var dt = Object.defineProperty;
-var mt = (i, e, n) => e in i ? dt(i, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[e] = n;
-var Pe = (i, e, n) => mt(i, typeof e != "symbol" ? e + "" : e, n);
-import { CommandType as $, ICommandService as W, IUniverInstanceService as X, TextX as Je, JSONX as k, MemoryCursor as ut, TextXActionType as j, LocaleService as en, RxDisposable as gt, UniverInstanceType as Ce, toDisposable as Ee, FOCUSING_COMMON_DRAWINGS as Ze, OnLifecycle as nn, LifecycleStages as tn, IContextService as xn, PositionedObjectLayoutType as B, BooleanNumber as Me, ObjectRelativeFromH as Y, ObjectRelativeFromV as G, Tools as _e, WrapTextType as Ae, Direction as ae, IUndoRedoService as mn, FOCUSING_UNIVER_EDITOR as pt, Disposable as Ue, UndoCommand as ft, RedoCommand as ht, throttle as In, COLORS as wt, Plugin as vt, DependentOn as It } from "@univerjs/core";
-import { Inject as Se, Injector as Un } from "@wendellhu/redi";
-import { ImageCropperObject as _t, COMPONENT_IMAGE_POPUP_MENU as Ct, OpenImageCropOperation as St, ImageResetSizeOperation as Dt, DrawingCommonPanel as Pt, UniverDrawingUIPlugin as Et } from "@univerjs/drawing-ui";
-import { IDrawingManagerService as ge, DRAWING_IMAGE_ALLOW_IMAGE_LIST as Ot, ArrangeTypeEnum as He, DrawingTypeEnum as un, DRAWING_IMAGE_COUNT_LIMIT as _n, ImageUploadStatusType as an, DRAWING_IMAGE_ALLOW_SIZE as Tt, getImageSize as Mt, DRAWING_IMAGE_WIDTH_LIMIT as Cn, DRAWING_IMAGE_HEIGHT_LIMIT as Sn, IImageIoService as yt, UniverDrawingPlugin as bt } from "@univerjs/drawing";
-import { IDocDrawingService as De, SetDocDrawingApplyMutation as fe, DocDrawingApplyType as he, UniverDocsDrawingPlugin as Rt } from "@univerjs/docs-drawing";
-import { ITextSelectionRenderManager as Le, IRenderManagerService as Q, DocumentEditArea as sn, getGroupState as Nt, transformObjectOutOfGroup as At, Liquid as Ln, PageLayoutType as Dn, NodePositionConvertToCursor as Pn, getOneTextSelectionRange as En, Vector2 as xt, getAnchorBounding as Ut, Rect as Lt, getColor as Ft, TEXT_RANGE_LAYER_INDEX as Bt } from "@univerjs/engine-render";
-import { takeUntil as On, combineLatest as Gt, Observable as Wt } from "rxjs";
-import { DocCanvasPopManagerService as Ht, docDrawingPositionToTransform as Tn, transformToDocDrawingPosition as Vt } from "@univerjs/docs-ui";
-import { RichTextEditingMutation as Z, getRichTextEditPath as on, DocSkeletonManagerService as me, TextSelectionManagerService as cn, getRetainAndDeleteFromReplace as jt, SetDocZoomRatioOperation as kt, getDocObject as $t } from "@univerjs/docs";
-import { ISidebarService as zt, MenuItemType as Fn, MenuPosition as Xt, MenuGroup as qt, getMenuHiddenObservable as Bn, KeyCode as ye, ComponentManager as Kt, IMenuService as Yt, IShortcutService as Zt, IMessageService as Qt, IEditorService as Jt } from "@univerjs/ui";
-import { useDependency as ie } from "@wendellhu/redi/react-bindings";
-import d, { forwardRef as Gn, useRef as Wn, createElement as Hn, useState as te, useEffect as gn } from "react";
-import H from "clsx";
-import { RadioGroup as Mn, Radio as Ie, InputNumber as Te, Select as yn, Checkbox as ei, MessageType as Ve } from "@univerjs/design";
-const pn = {
+var vn = Object.defineProperty;
+var In = (i, e, t) => e in i ? vn(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
+var _e = (i, e, t) => In(i, typeof e != "symbol" ? e + "" : e, t);
+import { CommandType as Y, ICommandService as $, IUniverInstanceService as te, TextX as pt, JSONX as X, MemoryCursor as _n, TextXActionType as Z, LocaleService as ot, RxDisposable as Cn, UniverInstanceType as be, toDisposable as ye, FOCUSING_COMMON_DRAWINGS as it, OnLifecycle as at, LifecycleStages as st, IContextService as Bt, PositionedObjectLayoutType as k, BooleanNumber as oe, ObjectRelativeFromH as ee, ObjectRelativeFromV as V, Tools as Pe, WrapTextType as je, Direction as ge, IUndoRedoService as Ft, FOCUSING_UNIVER_EDITOR as Sn, Disposable as qe, UndoCommand as Dn, RedoCommand as En, throttle as Ct, COLORS as Pn, Plugin as On, DependentOn as Tn } from "@univerjs/core";
+import { Inject as pe, Injector as kt } from "@wendellhu/redi";
+import { ImageCropperObject as Mn, COMPONENT_IMAGE_POPUP_MENU as yn, OpenImageCropOperation as bn, ImageResetSizeOperation as Rn, DrawingCommonPanel as Nn, UniverDrawingUIPlugin as An } from "@univerjs/drawing-ui";
+import { IDrawingManagerService as he, DRAWING_IMAGE_ALLOW_IMAGE_LIST as xn, ArrangeTypeEnum as Ye, DRAWING_IMAGE_COUNT_LIMIT as St, ImageUploadStatusType as mt, DRAWING_IMAGE_ALLOW_SIZE as Ln, getImageSize as Un, DrawingTypeEnum as Bn, getDrawingShapeKeyByDrawingSearch as Fn, DRAWING_IMAGE_WIDTH_LIMIT as Dt, DRAWING_IMAGE_HEIGHT_LIMIT as Et, IImageIoService as kn, UniverDrawingPlugin as Hn } from "@univerjs/drawing";
+import { IDocDrawingService as Re, UniverDocsDrawingPlugin as Wn } from "@univerjs/docs-drawing";
+import { ITextSelectionRenderManager as Ue, IRenderManagerService as se, DocumentEditArea as xe, Liquid as Ht, PageLayoutType as Pt, NodePositionConvertToCursor as Ot, getOneTextSelectionRange as Tt, DocumentSkeletonPageType as Mt, Vector2 as Gn, getAnchorBounding as Vn, Rect as jn, getColor as $n, TEXT_RANGE_LAYER_INDEX as zn } from "@univerjs/engine-render";
+import { takeUntil as yt, BehaviorSubject as qn } from "rxjs";
+import { DocCanvasPopManagerService as Xn, docDrawingPositionToTransform as Kn } from "@univerjs/docs-ui";
+import { RichTextEditingMutation as Q, getRichTextEditPath as $e, DocSkeletonManagerService as ae, TextSelectionManagerService as gt, getRetainAndDeleteFromReplace as Yn, SetDocZoomRatioOperation as Zn, getDocObject as Qn } from "@univerjs/docs";
+import { ISidebarService as Jn, MenuItemType as Wt, MenuPosition as ei, MenuGroup as ti, getMenuHiddenObservable as Gt, KeyCode as Le, ComponentManager as ni, IMenuService as ii, IShortcutService as ri, IMessageService as oi, IEditorService as ai } from "@univerjs/ui";
+import { useDependency as re } from "@wendellhu/redi/react-bindings";
+import d, { forwardRef as Vt, useRef as jt, createElement as $t, useState as ie, useEffect as ht } from "react";
+import j from "clsx";
+import { RadioGroup as bt, Radio as Ee, InputNumber as Ae, Select as Rt, Checkbox as si, MessageType as Nt } from "@univerjs/design";
+const wt = {
   id: "doc.command.remove-doc-image",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var S, O, R, D;
-    const n = i.get(W), t = i.get(X), o = i.get(Le), r = t.getCurrentUniverDocInstance();
-    if (e == null || r == null)
+    var C, O, y, T;
+    const t = i.get($), n = i.get(te), r = i.get(Ue), o = n.getCurrentUniverDocInstance();
+    if (e == null || o == null)
       return !1;
-    const { drawings: a } = e, s = (S = o.getSegment()) != null ? S : "", l = new Je(), c = k.getInstance(), m = (R = (O = r.getSelfOrHeaderFooterModel(s).getBody()) == null ? void 0 : O.customBlocks) != null ? R : [], u = a.map((b) => m.find((y) => y.blockId === b.drawingId)).filter((b) => !!b).sort((b, y) => b.startIndex > y.startIndex ? 1 : -1), p = a[0].unitId, f = new ut();
-    f.reset();
-    const g = u[0].startIndex, w = [
+    const { drawings: a } = e, s = (C = r.getSegment()) != null ? C : "", l = new pt(), c = X.getInstance(), m = (y = (O = o.getSelfOrHeaderFooterModel(s).getBody()) == null ? void 0 : O.customBlocks) != null ? y : [], u = a.map((N) => m.find((R) => R.blockId === N.drawingId)).filter((N) => !!N).sort((N, R) => N.startIndex > R.startIndex ? 1 : -1), f = a[0].unitId, h = new _n();
+    h.reset();
+    const p = u[0].startIndex, w = [
       {
-        startOffset: g,
-        endOffset: g
+        startOffset: p,
+        endOffset: p
       }
     ], v = {
-      id: Z.id,
+      id: Q.id,
       params: {
-        unitId: p,
+        unitId: f,
         actions: [],
         textRanges: w
       }
     }, I = [];
-    for (const b of u) {
-      const { startIndex: y } = b;
-      y > f.cursor && l.push({
-        t: j.RETAIN,
-        len: y - f.cursor,
+    for (const N of u) {
+      const { startIndex: R } = N;
+      R > h.cursor && l.push({
+        t: Z.RETAIN,
+        len: R - h.cursor,
         segmentId: ""
       }), l.push({
-        t: j.DELETE,
+        t: Z.DELETE,
         len: 1,
         line: 0,
         segmentId: ""
-      }), f.moveCursorTo(y + 1);
+      }), h.moveCursorTo(R + 1);
     }
-    const C = on(r, s);
-    I.push(c.editOp(l.serialize(), C));
-    for (const b of u) {
-      const { blockId: y } = b, T = ((D = r.getDrawings()) != null ? D : {})[y], x = r.getDrawingsOrder().indexOf(y), L = c.removeOp(["drawings", y], T), z = c.removeOp(["drawingsOrder", x], y);
-      I.push(L), I.push(z);
+    const D = $e(o, s);
+    I.push(c.editOp(l.serialize(), D));
+    for (const N of u) {
+      const { blockId: R } = N, E = ((T = o.getDrawings()) != null ? T : {})[R], z = o.getDrawingsOrder().indexOf(R), U = c.removeOp(["drawings", R], E), B = c.removeOp(["drawingsOrder", z], R);
+      I.push(U), I.push(B);
     }
-    return v.params.actions = I.reduce((b, y) => k.compose(b, y), null), !!n.syncExecuteCommand(v.id, v.params);
+    return v.params.actions = I.reduce((N, R) => X.compose(N, R), null), !!t.syncExecuteCommand(v.id, v.params);
   }
-}, Vn = "COMPONENT_DOC_DRAWING_PANEL", jn = {
+}, zt = "COMPONENT_DOC_DRAWING_PANEL", qt = {
   id: "sidebar.operation.doc-image",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: async (i, e) => {
-    const n = i.get(zt), t = i.get(en), o = i.get(ge);
+    const t = i.get(Jn), n = i.get(ot), r = i.get(he);
     switch (e.value) {
       case "open":
-        n.open({
-          header: { title: t.t("docImage.panel.title") },
-          children: { label: Vn },
+        t.open({
+          header: { title: n.t("docImage.panel.title") },
+          children: { label: zt },
           onClose: () => {
-            o.focusDrawing(null);
+            r.focusDrawing(null);
           },
           width: 360
         });
         break;
       case "close":
       default:
-        n.close();
+        t.close();
         break;
     }
     return !0;
   }
-}, kn = {
+}, Xt = {
   id: "doc.operation.edit-doc-image",
-  type: $.OPERATION,
+  type: Y.OPERATION,
   handler: (i, e) => {
-    const n = i.get(ge), t = i.get(W);
-    return e == null ? !1 : (n.focusDrawing([e]), t.executeCommand(jn.id, { value: "open" }), !0);
+    const t = i.get(he), n = i.get($);
+    return e == null ? !1 : (t.focusDrawing([e]), n.executeCommand(qt.id, { value: "open" }), !0);
   }
 };
-var ni = Object.defineProperty, ti = Object.getOwnPropertyDescriptor, ii = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? ti(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && ni(e, n, o), o;
-}, be = (i, e) => (n, t) => e(n, t, i);
-let Xe = class extends gt {
-  constructor(e, n, t, o, r) {
+var ci = Object.defineProperty, li = Object.getOwnPropertyDescriptor, di = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? li(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && ci(e, t, r), r;
+}, ke = (i, e) => (t, n) => e(t, n, i);
+let Je = class extends Cn {
+  constructor(e, t, n, r, o) {
     super();
-    Pe(this, "_initImagePopupMenu", /* @__PURE__ */ new Set());
-    this._drawingManagerService = e, this._canvasPopManagerService = n, this._renderManagerService = t, this._univerInstanceService = o, this._contextService = r, this._init();
+    _e(this, "_initImagePopupMenu", /* @__PURE__ */ new Set());
+    this._drawingManagerService = e, this._canvasPopManagerService = t, this._renderManagerService = n, this._univerInstanceService = r, this._contextService = o, this._init();
   }
   _init() {
-    this._univerInstanceService.getCurrentTypeOfUnit$(Ce.UNIVER_DOC).pipe(On(this.dispose$)).subscribe((e) => this._create(e)), this._univerInstanceService.getTypeOfUnitDisposed$(Ce.UNIVER_DOC).pipe(On(this.dispose$)).subscribe((e) => this._dispose(e)), this._univerInstanceService.getAllUnitsForType(Ce.UNIVER_DOC).forEach((e) => this._create(e));
+    this._univerInstanceService.getCurrentTypeOfUnit$(be.UNIVER_DOC).pipe(yt(this.dispose$)).subscribe((e) => this._create(e)), this._univerInstanceService.getTypeOfUnitDisposed$(be.UNIVER_DOC).pipe(yt(this.dispose$)).subscribe((e) => this._dispose(e)), this._univerInstanceService.getAllUnitsForType(be.UNIVER_DOC).forEach((e) => this._create(e));
   }
   _dispose(e) {
-    const n = e.getUnitId();
-    this._renderManagerService.removeRender(n);
+    const t = e.getUnitId();
+    this._renderManagerService.removeRender(t);
   }
   _create(e) {
     if (!e)
       return;
-    const n = e.getUnitId();
-    this._renderManagerService.has(n) && !this._initImagePopupMenu.has(n) && (this._popupMenuListener(n), this._initImagePopupMenu.add(n));
+    const t = e.getUnitId();
+    this._renderManagerService.has(t) && !this._initImagePopupMenu.has(t) && (this._popupMenuListener(t), this._initImagePopupMenu.add(t));
   }
   _hasCropObject(e) {
-    const n = e.getAllObjects();
-    for (const t of n)
-      if (t instanceof _t)
+    const t = e.getAllObjects();
+    for (const n of t)
+      if (n instanceof Mn)
         return !0;
     return !1;
   }
   // eslint-disable-next-line max-lines-per-function
   _popupMenuListener(e) {
-    var r;
-    const n = (r = this._renderManagerService.getRenderById(e)) == null ? void 0 : r.scene;
-    if (!n)
-      return;
-    const t = n.getTransformerByCreate();
+    var o;
+    const t = (o = this._renderManagerService.getRenderById(e)) == null ? void 0 : o.scene;
     if (!t)
       return;
-    const o = [];
+    const n = t.getTransformerByCreate();
+    if (!n)
+      return;
+    const r = [];
     this.disposeWithMe(
-      Ee(
-        t.createControl$.subscribe(() => {
-          if (this._hasCropObject(n))
+      ye(
+        n.createControl$.subscribe(() => {
+          if (this._hasCropObject(t))
             return;
-          const a = t.getSelectedObjectMap();
-          if (o.forEach((w) => w.dispose()), o.length = 0, a.size > 1)
+          const a = n.getSelectedObjectMap();
+          if (r.forEach((w) => w.dispose()), r.length = 0, a.size > 1)
             return;
           const s = a.values().next().value;
           if (!s)
@@ -146,379 +146,482 @@ let Xe = class extends gt {
           const l = s.oKey, c = this._drawingManagerService.getDrawingOKey(l);
           if (!c)
             return;
-          const { unitId: m, subUnitId: u, drawingId: p } = c;
-          o.push(this.disposeWithMe(this._canvasPopManagerService.attachPopupToObject(s, {
-            componentKey: Ct,
+          const { unitId: m, subUnitId: u, drawingId: f } = c;
+          r.push(this.disposeWithMe(this._canvasPopManagerService.attachPopupToObject(s, {
+            componentKey: yn,
             direction: "horizontal",
             offset: [2, 0],
             extraProps: {
-              menuItems: this._getImageMenuItems(m, u, p)
+              menuItems: this._getImageMenuItems(m, u, f)
             }
-          }))), !this._drawingManagerService.getFocusDrawings().find((w) => w.unitId === m && w.subUnitId === u && w.drawingId === p) && this._drawingManagerService.focusDrawing([{
+          }))), !this._drawingManagerService.getFocusDrawings().find((w) => w.unitId === m && w.subUnitId === u && w.drawingId === f) && this._drawingManagerService.focusDrawing([{
             unitId: m,
             subUnitId: u,
-            drawingId: p
+            drawingId: f
           }]);
         })
       )
     ), this.disposeWithMe(
-      Ee(
-        t.clearControl$.subscribe(() => {
-          o.forEach((a) => a.dispose()), o.length = 0, this._contextService.setContextValue(Ze, !1), this._drawingManagerService.focusDrawing(null);
+      ye(
+        n.clearControl$.subscribe(() => {
+          r.forEach((a) => a.dispose()), r.length = 0, this._contextService.setContextValue(it, !1), this._drawingManagerService.focusDrawing(null);
         })
       )
     ), this.disposeWithMe(
-      Ee(
-        t.changing$.subscribe(() => {
-          o.forEach((a) => a.dispose()), o.length = 0;
+      ye(
+        n.changing$.subscribe(() => {
+          r.forEach((a) => a.dispose()), r.length = 0;
         })
       )
     ), this.disposeWithMe(
-      Ee(
-        t.changeStart$.subscribe(() => {
-          o.forEach((a) => a.dispose()), o.length = 0;
+      ye(
+        n.changeStart$.subscribe(() => {
+          r.forEach((a) => a.dispose()), r.length = 0;
         })
       )
     );
   }
-  _getImageMenuItems(e, n, t) {
+  _getImageMenuItems(e, t, n) {
     return [
       {
         label: "image-popup.edit",
         index: 0,
-        commandId: kn.id,
-        commandParams: { unitId: e, subUnitId: n, drawingId: t },
+        commandId: Xt.id,
+        commandParams: { unitId: e, subUnitId: t, drawingId: n },
         disable: !1
       },
       {
         label: "image-popup.delete",
         index: 1,
-        commandId: pn.id,
-        commandParams: { unitId: e, drawings: [{ unitId: e, subUnitId: n, drawingId: t }] },
+        commandId: wt.id,
+        commandParams: { unitId: e, drawings: [{ unitId: e, subUnitId: t, drawingId: n }] },
         disable: !1
       },
       {
         label: "image-popup.crop",
         index: 2,
-        commandId: St.id,
-        commandParams: { unitId: e, subUnitId: n, drawingId: t },
+        commandId: bn.id,
+        commandParams: { unitId: e, subUnitId: t, drawingId: n },
         disable: !0
         // TODO: @JOCS, feature is not ready.
       },
       {
         label: "image-popup.reset",
         index: 3,
-        commandId: Dt.id,
-        commandParams: [{ unitId: e, subUnitId: n, drawingId: t }],
+        commandId: Rn.id,
+        commandParams: [{ unitId: e, subUnitId: t, drawingId: n }],
         disable: !0
         // TODO: @JOCS, feature is not ready.
       }
     ];
   }
 };
-Xe = ii([
-  nn(tn.Rendered, Xe),
-  be(0, ge),
-  be(1, Se(Ht)),
-  be(2, Q),
-  be(3, X),
-  be(4, xn)
-], Xe);
-var se = function() {
-  return se = Object.assign || function(i) {
-    for (var e, n = 1, t = arguments.length; n < t; n++) {
-      e = arguments[n];
-      for (var o in e) Object.prototype.hasOwnProperty.call(e, o) && (i[o] = e[o]);
+Je = di([
+  at(st.Rendered, Je),
+  ke(0, he),
+  ke(1, pe(Xn)),
+  ke(2, se),
+  ke(3, te),
+  ke(4, Bt)
+], Je);
+var ue = function() {
+  return ue = 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;
-  }, se.apply(this, arguments);
-}, oi = function(i, e) {
-  var n = {};
-  for (var t in i) Object.prototype.hasOwnProperty.call(i, t) && e.indexOf(t) < 0 && (n[t] = i[t]);
+  }, ue.apply(this, arguments);
+}, mi = 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 o = 0, t = Object.getOwnPropertySymbols(i); o < t.length; o++)
-      e.indexOf(t[o]) < 0 && Object.prototype.propertyIsEnumerable.call(i, t[o]) && (n[t[o]] = i[t[o]]);
-  return n;
-}, $n = Gn(function(i, e) {
-  var n = i.icon, t = i.id, o = i.className, r = i.extend, a = oi(i, ["icon", "id", "className", "extend"]), s = "univerjs-icon univerjs-icon-".concat(t, " ").concat(o || "").trim(), l = Wn("_".concat(si()));
-  return zn(n, "".concat(t), { defIds: n.defIds, idSuffix: l.current }, se({ ref: e, className: s }, a), r);
+    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;
+}, Kt = Vt(function(i, e) {
+  var t = i.icon, n = i.id, r = i.className, o = i.extend, a = mi(i, ["icon", "id", "className", "extend"]), s = "univerjs-icon univerjs-icon-".concat(n, " ").concat(r || "").trim(), l = jt("_".concat(fi()));
+  return Yt(t, "".concat(n), { defIds: t.defIds, idSuffix: l.current }, ue({ ref: e, className: s }, a), o);
 });
-function zn(i, e, n, t, o) {
-  return Hn(i.tag, se(se({ key: e }, ri(i, n, o)), t), (ai(i, n).children || []).map(function(r, a) {
-    return zn(r, "".concat(e, "-").concat(i.tag, "-").concat(a), n, void 0, o);
+function Yt(i, e, t, n, r) {
+  return $t(i.tag, ue(ue({ key: e }, gi(i, t, r)), n), (ui(i, t).children || []).map(function(o, a) {
+    return Yt(o, "".concat(e, "-").concat(i.tag, "-").concat(a), t, void 0, r);
   }));
 }
-function ri(i, e, n) {
-  var t = se({}, i.attrs);
-  n != null && n.colorChannel1 && t.fill === "colorChannel1" && (t.fill = n.colorChannel1);
-  var o = e.defIds;
-  return !o || o.length === 0 || (i.tag === "use" && t["xlink:href"] && (t["xlink:href"] = t["xlink:href"] + e.idSuffix), Object.entries(t).forEach(function(r) {
-    var a = r[0], s = r[1];
-    typeof s == "string" && (t[a] = s.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
-  })), t;
+function gi(i, e, t) {
+  var n = ue({}, i.attrs);
+  t != null && t.colorChannel1 && n.fill === "colorChannel1" && (n.fill = t.colorChannel1);
+  var r = e.defIds;
+  return !r || r.length === 0 || (i.tag === "use" && n["xlink:href"] && (n["xlink:href"] = n["xlink:href"] + e.idSuffix), Object.entries(n).forEach(function(o) {
+    var a = o[0], s = o[1];
+    typeof s == "string" && (n[a] = s.replace(/url\(#(.*)\)/, "url(#$1".concat(e.idSuffix, ")")));
+  })), n;
 }
-function ai(i, e) {
-  var n, t = e.defIds;
-  return !t || t.length === 0 ? i : i.tag === "defs" && (!((n = i.children) === null || n === void 0) && n.length) ? se(se({}, i), { children: i.children.map(function(o) {
-    return typeof o.attrs.id == "string" && t && t.indexOf(o.attrs.id) > -1 ? se(se({}, o), { attrs: se(se({}, o.attrs), { id: o.attrs.id + e.idSuffix }) }) : o;
+function ui(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) ? ue(ue({}, i), { children: i.children.map(function(r) {
+    return typeof r.attrs.id == "string" && n && n.indexOf(r.attrs.id) > -1 ? ue(ue({}, r), { attrs: ue(ue({}, r.attrs), { id: r.attrs.id + e.idSuffix }) }) : r;
   }) }) : i;
 }
-function si() {
+function fi() {
   return Math.random().toString(36).substring(2, 8);
 }
-$n.displayName = "UniverIcon";
-var ci = { 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" } }] }, Xn = Gn(function(i, e) {
-  return Hn($n, Object.assign({}, i, {
+Kt.displayName = "UniverIcon";
+var pi = { 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" } }] }, Zt = Vt(function(i, e) {
+  return $t(Kt, Object.assign({}, i, {
     id: "add-image-single",
     ref: e,
-    icon: ci
+    icon: pi
   }));
 });
-Xn.displayName = "AddImageSingle";
-const rn = {
+Zt.displayName = "AddImageSingle";
+const vt = {
   id: "doc.operation.insert-float-image",
-  type: $.OPERATION,
+  type: Y.OPERATION,
   handler: () => !0
-}, li = "univer-upload-file-menu", di = "univer-upload-file-menu-input", bn = {
-  uploadFileMenu: li,
-  uploadFileMenuInput: di
-}, mi = () => {
-  const i = ie(W), e = Wn(null), n = () => {
-    var r;
-    (r = e.current) == null || r.click();
-  }, t = Ot.map((r) => `.${r.replace("image/", "")}`).join(","), o = (r) => {
-    const a = r.target.files;
+}, hi = "univer-upload-file-menu", wi = "univer-upload-file-menu-input", At = {
+  uploadFileMenu: hi,
+  uploadFileMenuInput: wi
+}, vi = () => {
+  const i = re($), e = jt(null), t = () => {
+    var o;
+    (o = e.current) == null || o.click();
+  }, n = xn.map((o) => `.${o.replace("image/", "")}`).join(","), r = (o) => {
+    const a = o.target.files;
     if (a == null)
       return;
     const s = Array.from(a);
-    i.executeCommand(rn.id, { files: s }), e.current && (e.current.value = "");
+    i.executeCommand(vt.id, { files: s }), e.current && (e.current.value = "");
   };
-  return /* @__PURE__ */ d.createElement("div", { onClick: n, className: bn.uploadFileMenu }, /* @__PURE__ */ d.createElement(
+  return /* @__PURE__ */ d.createElement("div", { onClick: t, className: At.uploadFileMenu }, /* @__PURE__ */ d.createElement(
     "input",
     {
       type: "file",
-      className: bn.uploadFileMenuInput,
+      className: At.uploadFileMenuInput,
       ref: e,
-      onChange: o,
-      accept: t,
+      onChange: r,
+      accept: n,
       multiple: !0
     }
   ));
-}, qn = "COMPONENT_DOC_UPLOAD_FILE_MENU", Kn = "addition-and-subtraction-single", Yn = "doc.menu.image";
-function ui(i) {
-  const e = i.get(X), n = i.get(Q);
-  return new Wt((t) => {
-    const o = e.focused$.subscribe((s) => {
-      if (s == null)
-        return t.next(!0);
-      const l = n.getRenderById(s);
-      if (l == null)
-        return t.next(!0);
-      l.with(me).getViewModel().editAreaChange$.subscribe((m) => {
-        t.next(m === sn.HEADER || m === sn.FOOTER);
-      });
-    }), r = n.getCurrentTypeOfRenderer(Ce.UNIVER_DOC);
-    if (r == null)
-      return t.next(!0);
-    const a = r.with(me).getViewModel();
-    return t.next(a.getEditArea() !== sn.BODY), () => o.unsubscribe();
-  });
-}
-function gi(i) {
+}, Qt = "COMPONENT_DOC_UPLOAD_FILE_MENU", Jt = "addition-and-subtraction-single", en = "doc.menu.image", Ii = "doc.menu.image.upload.float";
+function _i(i) {
   return {
-    id: Yn,
-    type: Fn.SUBITEMS,
-    positions: [Xt.TOOLBAR_START],
-    group: qt.TOOLBAR_LAYOUT,
-    icon: Kn,
+    id: en,
+    type: Wt.SUBITEMS,
+    positions: [ei.TOOLBAR_START],
+    group: ti.TOOLBAR_LAYOUT,
+    icon: Jt,
     tooltip: "docImage.title",
-    hidden$: Gt(Bn(i, Ce.UNIVER_DOC), ui(i), (e, n) => e || n)
+    hidden$: Gt(i, be.UNIVER_DOC)
   };
 }
-function pi(i) {
+function Ci(i) {
   return {
-    id: rn.id,
+    id: Ii,
     title: "docImage.upload.float",
-    type: Fn.SELECTOR,
+    type: Wt.SELECTOR,
     label: {
-      name: qn
+      name: Qt
     },
-    positions: [Yn],
-    hidden$: Bn(i, Ce.UNIVER_DOC)
+    positions: [en],
+    hidden$: Gt(i, be.UNIVER_DOC)
   };
 }
-const fi = "univer-image-common-panel", hi = "univer-image-common-panel-grid", wi = "univer-image-common-panel-border", vi = "univer-image-common-panel-title", Ii = "univer-image-common-panel-subtitle", _i = "univer-image-common-panel-row", Ci = "univer-image-common-panel-row-vertical", Si = "univer-image-common-panel-column", Di = "univer-image-common-panel-column-center", Pi = "univer-image-common-panel-inline", Ei = "univer-image-common-panel-span2", Oi = "univer-image-common-panel-span3", Ti = "univer-image-common-panel-input", Mi = "univer-sheet-image-menu", yi = "univer-sheet-image-menu-input", h = {
-  imageCommonPanel: fi,
-  imageCommonPanelGrid: hi,
-  imageCommonPanelBorder: wi,
-  imageCommonPanelTitle: vi,
-  imageCommonPanelSubtitle: Ii,
-  imageCommonPanelRow: _i,
-  imageCommonPanelRowVertical: Ci,
-  imageCommonPanelColumn: Si,
-  imageCommonPanelColumnCenter: Di,
-  imageCommonPanelInline: Pi,
-  imageCommonPanelSpan2: Ei,
-  imageCommonPanelSpan3: Oi,
-  imageCommonPanelInput: Ti,
-  sheetImageMenu: Mi,
-  sheetImageMenuInput: yi
+const Si = "univer-image-common-panel", Di = "univer-image-common-panel-grid", Ei = "univer-image-common-panel-border", Pi = "univer-image-common-panel-title", Oi = "univer-image-common-panel-subtitle", Ti = "univer-image-common-panel-row", Mi = "univer-image-common-panel-row-vertical", yi = "univer-image-common-panel-column", bi = "univer-image-common-panel-column-center", Ri = "univer-image-common-panel-inline", Ni = "univer-image-common-panel-span2", Ai = "univer-image-common-panel-span3", xi = "univer-image-common-panel-input", Li = "univer-sheet-image-menu", Ui = "univer-sheet-image-menu-input", g = {
+  imageCommonPanel: Si,
+  imageCommonPanelGrid: Di,
+  imageCommonPanelBorder: Ei,
+  imageCommonPanelTitle: Pi,
+  imageCommonPanelSubtitle: Oi,
+  imageCommonPanelRow: Ti,
+  imageCommonPanelRowVertical: Mi,
+  imageCommonPanelColumn: yi,
+  imageCommonPanelColumnCenter: bi,
+  imageCommonPanelInline: Ri,
+  imageCommonPanelSpan2: Ni,
+  imageCommonPanelSpan3: Ai,
+  imageCommonPanelInput: xi,
+  sheetImageMenu: Li,
+  sheetImageMenuInput: Ui
 };
-var re = /* @__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))(re || {});
-const bi = {
-  inline: B.INLINE,
-  wrapSquare: B.WRAP_SQUARE,
-  wrapTopAndBottom: B.WRAP_TOP_AND_BOTTOM,
-  inFrontOfText: B.WRAP_NONE,
-  behindText: B.WRAP_NONE
-}, Zn = {
+class ct {
+  constructor() {
+    _e(this, "_refreshDrawings$", new qn(null));
+    _e(this, "refreshDrawings$", this._refreshDrawings$.asObservable());
+  }
+  refreshDrawings(e) {
+    this._refreshDrawings$.next(e);
+  }
+}
+var me = /* @__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))(me || {});
+const Bi = {
+  inline: k.INLINE,
+  wrapSquare: k.WRAP_SQUARE,
+  wrapTopAndBottom: k.WRAP_TOP_AND_BOTTOM,
+  inFrontOfText: k.WRAP_NONE,
+  behindText: k.WRAP_NONE
+};
+function tn(i, e, t, n, r, o, a) {
+  var h, p;
+  const s = new pt(), l = X.getInstance(), c = [], m = o.getSelfOrHeaderFooterModel(e).getBody(), u = o.getSelfOrHeaderFooterModel(i).getBody();
+  if (m == null || u == null)
+    return;
+  const f = (p = (h = m.customBlocks) == null ? void 0 : h.find((w) => w.blockId === r)) == null ? void 0 : p.startIndex;
+  if (f != null) {
+    if (n = Math.min(u.dataStream.length - 2, n), i === e) {
+      if (n < f ? (n > 0 && s.push({
+        t: Z.RETAIN,
+        len: n,
+        segmentId: e
+      }), s.push({
+        t: Z.INSERT,
+        body: {
+          dataStream: "\b",
+          customBlocks: [{
+            startIndex: 0,
+            blockId: r
+          }]
+        },
+        len: 1,
+        line: 0,
+        segmentId: e
+      }), s.push({
+        t: Z.RETAIN,
+        len: f - n,
+        segmentId: e
+      }), s.push({
+        t: Z.DELETE,
+        len: 1,
+        line: 0,
+        segmentId: ""
+      })) : (f > 0 && s.push({
+        t: Z.RETAIN,
+        len: f,
+        segmentId: e
+      }), s.push({
+        t: Z.DELETE,
+        len: 1,
+        line: 0,
+        segmentId: ""
+      }), n - f - 1 > 0 && s.push({
+        t: Z.RETAIN,
+        len: n - f - 1,
+        segmentId: e
+      }), s.push({
+        t: Z.INSERT,
+        body: {
+          dataStream: "\b",
+          customBlocks: [{
+            startIndex: 0,
+            blockId: r
+          }]
+        },
+        len: 1,
+        line: 0,
+        segmentId: e
+      })), n !== f) {
+        const w = $e(o, e), v = l.editOp(s.serialize(), w);
+        c.push(v);
+      }
+    } else {
+      f > 0 && s.push({
+        t: Z.RETAIN,
+        len: f,
+        segmentId: e
+      }), s.push({
+        t: Z.DELETE,
+        len: 1,
+        line: 0,
+        segmentId: ""
+      });
+      let w = $e(o, e), v = l.editOp(s.serialize(), w);
+      c.push(v), s.empty(), n > 0 && s.push({
+        t: Z.RETAIN,
+        len: n,
+        segmentId: i
+      }), s.push({
+        t: Z.INSERT,
+        body: {
+          dataStream: "\b",
+          customBlocks: [{
+            startIndex: 0,
+            blockId: r
+          }]
+        },
+        len: 1,
+        line: 0,
+        segmentId: i
+      }), w = $e(o, i), v = l.editOp(s.serialize(), w), c.push(v), a.setSegment(i), a.setSegmentPage(t);
+    }
+    return c;
+  }
+}
+const nn = {
   id: "doc.command.update-doc-drawing-wrapping-style",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   // eslint-disable-next-line max-lines-per-function, complexity
   handler: (i, e) => {
+    var T, N;
     if (e == null)
       return !1;
-    const { drawings: n, wrappingStyle: t, unitId: o } = e, r = i.get(W), a = i.get(X), l = i.get(Q).getRenderById(o), c = l == null ? void 0 : l.with(me).getSkeleton().getSkeletonData(), m = l == null ? void 0 : l.scene, u = a.getCurrentUniverDocInstance();
-    if (u == null || c == null || m == null)
+    const { drawings: t, wrappingStyle: n, unitId: r } = e, o = i.get($), a = i.get(te), l = i.get(se).getRenderById(r), c = l == null ? void 0 : l.with(ae).getSkeleton().getSkeletonData(), m = l == null ? void 0 : l.with(ae).getViewModel(), u = l == null ? void 0 : l.scene, f = a.getCurrentUniverDocInstance();
+    if (f == null || c == null || u == null || m == null)
       return !1;
-    const p = m.getTransformerByCreate(), { pages: f } = c, g = k.getInstance(), w = [], { drawings: v = {} } = u.getSnapshot();
-    for (const P of n) {
-      const { drawingId: S } = P, O = v[S].layoutType, R = bi[t];
-      if (O !== R) {
-        const T = g.replaceOp(["drawings", S, "layoutType"], O, R);
-        w.push(T);
+    const h = m.getEditArea(), p = u.getTransformerByCreate(), { pages: w, skeHeaders: v, skeFooters: I } = c, D = X.getInstance(), _ = [], { drawings: C = {} } = f.getSnapshot();
+    for (const R of t) {
+      const { drawingId: E } = R, H = C[E].layoutType, z = Bi[n];
+      if (H !== z) {
+        const S = D.replaceOp(["drawings", E, "layoutType"], H, z);
+        _.push(S);
       }
-      if (t === "behindText" || t === "inFrontOfText") {
-        const T = v[S].behindDoc, V = t === "behindText" ? Me.TRUE : Me.FALSE;
-        if (T !== V) {
-          const x = g.replaceOp(["drawings", S, "behindDoc"], T, V);
-          w.push(x);
+      if (n === "behindText" || n === "inFrontOfText") {
+        const S = C[E].behindDoc, A = n === "behindText" ? oe.TRUE : oe.FALSE;
+        if (S !== A) {
+          const P = D.replaceOp(["drawings", E, "behindDoc"], S, A);
+          _.push(P);
         }
       }
-      if (t === "inline")
+      if (n === "inline")
         continue;
-      let D = null, b = 0, y = 0;
-      for (const T of f)
-        if (T.skeDrawings.has(S)) {
-          D = T.skeDrawings.get(S), b = T.marginTop, y = T.marginLeft;
-          break;
+      let U = null, B = 0, b = 0;
+      for (const S of w) {
+        const { headerId: A, footerId: P, marginTop: L, marginLeft: x, marginBottom: M, pageWidth: W, pageHeight: G } = S;
+        switch (h) {
+          case xe.HEADER: {
+            const F = (T = v.get(A)) == null ? void 0 : T.get(W);
+            F != null && F.skeDrawings.has(E) && (U = F.skeDrawings.get(E), B = F.marginTop, b = x);
+            break;
+          }
+          case xe.FOOTER: {
+            const F = (N = I.get(P)) == null ? void 0 : N.get(W);
+            F != null && F.skeDrawings.has(E) && (U = F.skeDrawings.get(E), B = G - M + F.marginTop, b = x);
+            break;
+          }
+          case xe.BODY: {
+            S.skeDrawings.has(E) && (U = S.skeDrawings.get(E), B = L, b = x);
+            break;
+          }
         }
-      if (D != null) {
-        const { aTop: T, aLeft: V } = D, x = v[S].docTransform.positionH;
-        let L = V;
-        x.relativeFrom === Y.MARGIN ? L -= y : x.relativeFrom === Y.COLUMN && (L -= D.columnLeft);
-        const z = {
-          relativeFrom: x.relativeFrom,
+        if (U != null)
+          break;
+      }
+      if (U != null) {
+        const { aTop: S, aLeft: A } = U, P = C[E].docTransform.positionH;
+        let L = A;
+        P.relativeFrom === ee.MARGIN ? L -= b : P.relativeFrom === ee.COLUMN && (L -= U.columnLeft);
+        const x = {
+          relativeFrom: P.relativeFrom,
           posOffset: L
         };
-        if (x.posOffset !== z.posOffset) {
-          const E = g.replaceOp(["drawings", S, "docTransform", "positionH"], x, z);
-          w.push(E);
+        if (P.posOffset !== x.posOffset) {
+          const F = D.replaceOp(["drawings", E, "docTransform", "positionH"], P, x);
+          _.push(F);
         }
-        const N = v[S].docTransform.positionV;
-        let _ = T;
-        N.relativeFrom === G.PAGE ? _ += b : N.relativeFrom === G.LINE ? _ -= D.lineTop : N.relativeFrom === G.PARAGRAPH && (_ -= D.blockAnchorTop);
-        const M = {
-          relativeFrom: N.relativeFrom,
-          posOffset: _
+        const M = C[E].docTransform.positionV;
+        let W = S;
+        M.relativeFrom === V.PAGE ? W += B : M.relativeFrom === V.LINE ? W -= U.lineTop : M.relativeFrom === V.PARAGRAPH && (W -= U.blockAnchorTop);
+        const G = {
+          relativeFrom: M.relativeFrom,
+          posOffset: W
         };
-        if (N.posOffset !== M.posOffset) {
-          const E = g.replaceOp(["drawings", S, "docTransform", "positionV"], N, M);
-          w.push(E);
+        if (M.posOffset !== G.posOffset) {
+          const F = D.replaceOp(["drawings", E, "docTransform", "positionV"], M, G);
+          _.push(F);
         }
       }
     }
-    const I = {
-      id: Z.id,
+    const O = {
+      id: Q.id,
       params: {
-        unitId: o,
+        unitId: r,
         actions: [],
         textRanges: null
       }
     };
-    I.params.actions = w.reduce((P, S) => k.compose(P, S), null);
-    const C = r.syncExecuteCommand(I.id, I.params);
-    return p.refreshControls(), !!C;
+    O.params.actions = _.reduce((R, E) => X.compose(R, E), null);
+    const y = o.syncExecuteCommand(O.id, O.params);
+    return p.refreshControls(), !!y;
   }
-}, Qn = {
+}, rn = {
   id: "doc.command.update-doc-drawing-distance",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const n = i.get(W), o = i.get(X).getCurrentUniverDocInstance();
-    if (o == null)
+    const t = i.get($), r = i.get(te).getCurrentUniverDocInstance();
+    if (r == null)
       return !1;
-    const { drawings: r, dist: a, unitId: s } = e, l = k.getInstance(), c = [], { drawings: m = {} } = o.getSnapshot();
-    for (const f of r) {
-      const { drawingId: g } = f;
+    const { drawings: o, dist: a, unitId: s } = e, l = X.getInstance(), c = [], { drawings: m = {} } = r.getSnapshot();
+    for (const h of o) {
+      const { drawingId: p } = h;
       for (const [w, v] of Object.entries(a)) {
-        const I = m[g][w];
+        const I = m[p][w];
         if (I !== v) {
-          const C = l.replaceOp(["drawings", g, w], I, v);
-          c.push(C);
+          const D = l.replaceOp(["drawings", p, w], I, v);
+          c.push(D);
         }
       }
     }
     const u = {
-      id: Z.id,
+      id: Q.id,
       params: {
         unitId: s,
         actions: [],
         textRanges: null
       }
     };
-    return u.params.actions = c.reduce((f, g) => k.compose(f, g), null), !!n.syncExecuteCommand(u.id, u.params);
+    return u.params.actions = c.reduce((h, p) => X.compose(h, p), null), !!t.syncExecuteCommand(u.id, u.params);
   }
-}, Jn = {
+}, on = {
   id: "doc.command.update-doc-drawing-wrap-text",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const n = i.get(W), o = i.get(X).getCurrentUniverDocInstance();
-    if (o == null)
+    const t = i.get($), r = i.get(te).getCurrentUniverDocInstance();
+    if (r == null)
       return !1;
-    const { drawings: r, wrapText: a, unitId: s } = e, l = k.getInstance(), c = [], { drawings: m = {} } = o.getSnapshot();
-    for (const f of r) {
-      const { drawingId: g } = f, w = m[g].wrapText;
+    const { drawings: o, wrapText: a, unitId: s } = e, l = X.getInstance(), c = [], { drawings: m = {} } = r.getSnapshot();
+    for (const h of o) {
+      const { drawingId: p } = h, w = m[p].wrapText;
       if (w !== a) {
-        const v = l.replaceOp(["drawings", g, "wrapText"], w, a);
+        const v = l.replaceOp(["drawings", p, "wrapText"], w, a);
         c.push(v);
       }
     }
     const u = {
-      id: Z.id,
+      id: Q.id,
       params: {
         unitId: s,
         actions: [],
         textRanges: null
       }
     };
-    return u.params.actions = c.reduce((f, g) => k.compose(f, g), null), !!n.syncExecuteCommand(u.id, u.params);
+    return u.params.actions = c.reduce((h, p) => X.compose(h, p), null), !!t.syncExecuteCommand(u.id, u.params);
   }
-}, xe = {
+}, ze = {
   id: "doc.command.update-drawing-doc-transform",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
     if (e == null)
       return !1;
-    const n = i.get(W), t = i.get(X), r = i.get(Q).getRenderById(e.unitId), a = r == null ? void 0 : r.scene;
+    const t = i.get($), n = i.get(te), o = i.get(se).getRenderById(e.unitId), a = o == null ? void 0 : o.scene;
     if (a == null)
       return !1;
-    const s = a.getTransformerByCreate(), l = t.getCurrentUniverDocInstance();
+    const s = a.getTransformerByCreate(), l = n.getCurrentUniverDocInstance();
     if (l == null)
       return !1;
-    const { drawings: c, unitId: m } = e, u = k.getInstance(), p = [], { drawings: f = {} } = l.getSnapshot();
+    const { drawings: c, unitId: m } = e, u = X.getInstance(), f = [], { drawings: h = {} } = l.getSnapshot();
     for (const v of c) {
-      const { drawingId: I, key: C, value: P } = v, S = f[I].docTransform[C];
-      if (!_e.diffValue(S, P)) {
-        const O = u.replaceOp(["drawings", I, "docTransform", C], S, P);
-        p.push(O);
+      const { drawingId: I, key: D, value: _ } = v, C = h[I].docTransform[D];
+      if (!Pe.diffValue(C, _)) {
+        const O = u.replaceOp(["drawings", I, "docTransform", D], C, _);
+        f.push(O);
       }
     }
-    const g = {
-      id: Z.id,
+    const p = {
+      id: Q.id,
       params: {
         unitId: m,
         actions: [],
@@ -526,182 +629,92 @@ const bi = {
         debounce: !0
       }
     };
-    g.params.actions = p.reduce((v, I) => k.compose(v, I), null);
-    const w = n.syncExecuteCommand(g.id, g.params);
+    p.params.actions = f.reduce((v, I) => X.compose(v, I), null);
+    const w = t.syncExecuteCommand(p.id, p.params);
     return s.refreshControls(), !!w;
   }
-}, et = {
+}, an = {
   id: "doc.command.move-inline-drawing",
-  type: $.COMMAND,
-  // eslint-disable-next-line max-lines-per-function
+  type: Y.COMMAND,
   handler: (i, e) => {
-    var D, b, y, T;
+    var T;
     if (e == null)
       return !1;
-    const n = i.get(Q), t = i.get(Le), o = n.getRenderById(e.unitId), r = o == null ? void 0 : o.scene;
-    if (r == null)
-      return !1;
-    const a = r.getTransformerByCreate(), s = i.get(W), c = i.get(X).getCurrentUniverDocInstance();
-    if (c == null)
+    const t = i.get(se), n = i.get(Ue), r = i.get(ct), o = t.getRenderById(e.unitId), a = o == null ? void 0 : o.scene, s = o == null ? void 0 : o.with(ae).getSkeleton();
+    if (a == null)
       return !1;
-    const { drawing: m, unitId: u, offset: p } = e, f = new Je(), g = k.getInstance(), w = [], { drawingId: v } = m, I = (D = t.getSegment()) != null ? D : "", C = (T = (y = (b = c.getSelfOrHeaderFooterModel(I).getBody()) == null ? void 0 : b.customBlocks) == null ? void 0 : y.find((V) => V.blockId === v)) == null ? void 0 : T.startIndex;
-    if (C == null)
+    const l = a.getTransformerByCreate(), c = i.get($), u = i.get(te).getCurrentUniverDocInstance();
+    if (u == null)
       return !1;
-    p < C ? (p > 0 && f.push({
-      t: j.RETAIN,
-      len: p,
-      segmentId: I
-    }), f.push({
-      t: j.INSERT,
-      body: {
-        dataStream: "\b",
-        customBlocks: [{
-          startIndex: 0,
-          blockId: m.drawingId
-        }]
-      },
-      len: 1,
-      line: 0,
-      segmentId: I
-    }), f.push({
-      t: j.RETAIN,
-      len: C - p,
-      segmentId: I
-    }), f.push({
-      t: j.DELETE,
-      len: 1,
-      line: 0,
-      segmentId: ""
-    })) : (C > 0 && f.push({
-      t: j.RETAIN,
-      len: C,
-      segmentId: I
-    }), f.push({
-      t: j.DELETE,
-      len: 1,
-      line: 0,
-      segmentId: ""
-    }), p - C - 1 > 0 && f.push({
-      t: j.RETAIN,
-      len: p - C - 1,
-      segmentId: I
-    }), f.push({
-      t: j.INSERT,
-      body: {
-        dataStream: "\b",
-        customBlocks: [{
-          startIndex: 0,
-          blockId: m.drawingId
-        }]
-      },
-      len: 1,
-      line: 0,
-      segmentId: I
-    }));
-    const P = on(c, I), S = g.editOp(f.serialize(), P);
-    w.push(S);
+    const { drawing: f, unitId: h, offset: p, segmentId: w, segmentPage: v } = e, I = [], { drawingId: D } = f, _ = (T = n.getSegment()) != null ? T : "", C = tn(
+      w,
+      _,
+      v,
+      p,
+      D,
+      u,
+      n
+    );
+    if (C == null || C.length === 0)
+      return r.refreshDrawings(s), l.refreshControls(), !1;
+    I.push(...C);
     const O = {
-      id: Z.id,
+      id: Q.id,
       params: {
-        unitId: u,
+        unitId: h,
         actions: [],
         textRanges: null
       }
     };
-    O.params.actions = w.reduce((V, x) => k.compose(V, x), null);
-    const R = s.syncExecuteCommand(O.id, O.params);
-    return a.refreshControls(), !!R;
+    O.params.actions = I.reduce((N, R) => X.compose(N, R), null);
+    const y = c.syncExecuteCommand(O.id, O.params);
+    return l.refreshControls(), !!y;
   }
-}, nt = {
+}, sn = {
   id: "doc.command.transform-non-inline-drawing",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var x, L, z, N;
+    var U;
     if (e == null)
       return !1;
-    const n = i.get(Le), o = i.get(Q).getRenderById(e.unitId), r = o == null ? void 0 : o.scene;
-    if (r == null)
+    const t = i.get(Ue), r = i.get(se).getRenderById(e.unitId), o = r == null ? void 0 : r.scene;
+    if (o == null)
       return !1;
-    const a = r.getTransformerByCreate(), s = i.get(W), c = i.get(X).getCurrentUniverDocInstance();
+    const a = o.getTransformerByCreate(), s = i.get($), c = i.get(te).getCurrentUniverDocInstance();
     if (c == null)
       return !1;
-    const { drawing: m, unitId: u, offset: p, docTransform: f } = e, g = new Je(), w = k.getInstance(), v = [], { drawingId: I } = m, C = (x = n.getSegment()) != null ? x : "", P = (N = (z = (L = c.getSelfOrHeaderFooterModel(C).getBody()) == null ? void 0 : L.customBlocks) == null ? void 0 : z.find((_) => _.blockId === I)) == null ? void 0 : N.startIndex;
-    if (P == null)
+    const { drawing: m, unitId: u, offset: f, docTransform: h, segmentId: p, segmentPage: w } = e, v = [], { drawingId: I } = m, D = (U = t.getSegment()) != null ? U : "", _ = tn(
+      p,
+      D,
+      w,
+      f,
+      I,
+      c,
+      t
+    );
+    if (_ == null)
       return !1;
-    if (p < P ? (p > 0 && g.push({
-      t: j.RETAIN,
-      len: p,
-      segmentId: C
-    }), g.push({
-      t: j.INSERT,
-      body: {
-        dataStream: "\b",
-        customBlocks: [{
-          startIndex: 0,
-          blockId: m.drawingId
-        }]
-      },
-      len: 1,
-      line: 0,
-      segmentId: C
-    }), g.push({
-      t: j.RETAIN,
-      len: P - p,
-      segmentId: C
-    }), g.push({
-      t: j.DELETE,
-      len: 1,
-      line: 0,
-      segmentId: ""
-    })) : p > P && (P > 0 && g.push({
-      t: j.RETAIN,
-      len: P,
-      segmentId: C
-    }), g.push({
-      t: j.DELETE,
-      len: 1,
-      line: 0,
-      segmentId: ""
-    }), p - P - 1 > 0 && g.push({
-      t: j.RETAIN,
-      len: p - P - 1,
-      segmentId: C
-    }), g.push({
-      t: j.INSERT,
-      body: {
-        dataStream: "\b",
-        customBlocks: [{
-          startIndex: 0,
-          blockId: m.drawingId
-        }]
-      },
-      len: 1,
-      line: 0,
-      segmentId: C
-    })), p !== P) {
-      const _ = on(c, C), M = w.editOp(g.serialize(), _);
-      v.push(M);
-    }
-    const { drawings: S = {} } = c.getSnapshot(), O = S[I].docTransform, { positionH: R, positionV: D, size: b, angle: y } = O;
-    if (!_e.diffValue(R, f.positionH)) {
-      const _ = w.replaceOp(["drawings", I, "docTransform", "positionH"], R, f.positionH);
-      v.push(_);
+    _.length > 0 && v.push(..._);
+    const C = X.getInstance(), { drawings: O = {} } = c.getSnapshot(), y = O[I].docTransform, { positionH: T, positionV: N, size: R, angle: E } = y;
+    if (!Pe.diffValue(T, h.positionH)) {
+      const B = C.replaceOp(["drawings", I, "docTransform", "positionH"], T, h.positionH);
+      v.push(B);
     }
-    if (!_e.diffValue(D, f.positionV)) {
-      const _ = w.replaceOp(["drawings", I, "docTransform", "positionV"], D, f.positionV);
-      v.push(_);
+    if (!Pe.diffValue(N, h.positionV)) {
+      const B = C.replaceOp(["drawings", I, "docTransform", "positionV"], N, h.positionV);
+      v.push(B);
     }
-    if (!_e.diffValue(b, f.size)) {
-      const _ = w.replaceOp(["drawings", I, "docTransform", "size"], b, f.size);
-      v.push(_);
+    if (!Pe.diffValue(R, h.size)) {
+      const B = C.replaceOp(["drawings", I, "docTransform", "size"], R, h.size);
+      v.push(B);
     }
-    if (!_e.diffValue(y, f.angle)) {
-      const _ = w.replaceOp(["drawings", I, "docTransform", "angle"], y, f.angle);
-      v.push(_);
+    if (!Pe.diffValue(E, h.angle)) {
+      const B = C.replaceOp(["drawings", I, "docTransform", "angle"], E, h.angle);
+      v.push(B);
     }
-    const T = {
-      id: Z.id,
+    const H = {
+      id: Q.id,
       params: {
         unitId: u,
         actions: [],
@@ -709,433 +722,444 @@ const bi = {
         debounce: !0
       }
     };
-    T.params.actions = v.reduce((_, M) => k.compose(_, M), null);
-    const V = s.syncExecuteCommand(T.id, T.params);
-    return a.refreshControls(), !!V;
+    H.params.actions = v.reduce((B, b) => X.compose(B, b), null);
+    const z = s.syncExecuteCommand(H.id, H.params);
+    return a.refreshControls(), !!z;
   }
-}, je = 0, ke = 100, Ri = (i) => {
-  const e = ie(W), n = ie(en), t = ie(ge), o = ie(Q), r = ie(X), { drawings: a } = i, s = a[0];
+}, Ze = 0, Qe = 100, Fi = (i) => {
+  const e = re($), t = re(ot), n = re(he), r = re(se), o = re(te), { drawings: a } = i, s = a[0];
   if (s == null)
     return null;
-  const { unitId: l } = s, c = r.getUniverDocInstance(l), m = o.getRenderById(l);
+  const { unitId: l } = s, c = o.getUniverDocInstance(l), m = r.getRenderById(l);
   if ((m == null ? void 0 : m.scene) == null)
     return null;
-  const [p, f] = te(!0), [g, w] = te(!0), [v, I] = te(!0), [C, P] = te(re.INLINE), [S, O] = te(""), [R, D] = te({
+  const [f, h] = ie(!0), [p, w] = ie(!0), [v, I] = ie(!0), [D, _] = ie(me.INLINE), [C, O] = ie(""), [y, T] = ie({
     distT: 0,
     distL: 0,
     distB: 0,
     distR: 0
-  }), [b, y] = te(!0);
-  function T(N) {
-    P(N);
-    const _ = t.getFocusDrawings();
-    if (_.length === 0)
+  }), [N, R] = ie(!0);
+  function E(b) {
+    _(b);
+    const S = n.getFocusDrawings();
+    if (S.length === 0)
       return;
-    const { unitId: M, subUnitId: E } = _[0], A = _.map(({ unitId: U, subUnitId: F, drawingId: q }) => ({
-      unitId: U,
-      subUnitId: F,
-      drawingId: q
+    const { unitId: A, subUnitId: P } = S[0], L = S.map(({ unitId: x, subUnitId: M, drawingId: W }) => ({
+      unitId: x,
+      subUnitId: M,
+      drawingId: W
     }));
-    e.executeCommand(Zn.id, {
-      unitId: M,
-      subUnitId: E,
-      drawings: A,
-      wrappingStyle: N
+    e.executeCommand(nn.id, {
+      unitId: A,
+      subUnitId: P,
+      drawings: L,
+      wrappingStyle: b
     });
   }
-  function V(N) {
-    O(N);
-    const _ = t.getFocusDrawings();
-    if (_.length === 0)
+  function H(b) {
+    O(b);
+    const S = n.getFocusDrawings();
+    if (S.length === 0)
       return;
-    const M = _.map((E) => ({
-      unitId: E.unitId,
-      subUnitId: E.subUnitId,
-      drawingId: E.drawingId
+    const A = S.map((P) => ({
+      unitId: P.unitId,
+      subUnitId: P.subUnitId,
+      drawingId: P.drawingId
     }));
-    e.executeCommand(Jn.id, {
-      unitId: _[0].unitId,
-      subUnitId: _[0].unitId,
-      drawings: M,
-      wrapText: N
+    e.executeCommand(on.id, {
+      unitId: S[0].unitId,
+      subUnitId: S[0].unitId,
+      drawings: A,
+      wrapText: b
     });
   }
-  function x(N, _) {
-    if (N == null)
+  function z(b, S) {
+    if (b == null)
       return;
-    const M = { ...R, [_]: N };
-    D(M);
-    const E = t.getFocusDrawings();
-    if (E.length === 0)
+    const A = { ...y, [S]: b };
+    T(A);
+    const P = n.getFocusDrawings();
+    if (P.length === 0)
       return;
-    const A = E.map((U) => ({
-      unitId: U.unitId,
-      subUnitId: U.subUnitId,
-      drawingId: U.drawingId
+    const L = P.map((x) => ({
+      unitId: x.unitId,
+      subUnitId: x.subUnitId,
+      drawingId: x.drawingId
     }));
-    e.executeCommand(Qn.id, {
-      unitId: E[0].unitId,
-      subUnitId: E[0].unitId,
-      drawings: A,
+    e.executeCommand(rn.id, {
+      unitId: P[0].unitId,
+      subUnitId: P[0].unitId,
+      drawings: L,
       dist: {
-        [_]: N
+        [S]: b
       }
     });
   }
-  function L() {
-    const N = t.getFocusDrawings();
-    N.length !== 0 && z(N[0]);
+  function U() {
+    const b = n.getFocusDrawings();
+    b.length !== 0 && B(b[0]);
   }
-  function z(N) {
-    var ce, pe;
-    const _ = (pe = (ce = c == null ? void 0 : c.getSnapshot()) == null ? void 0 : ce.drawings) == null ? void 0 : pe[N.drawingId];
-    if (_ == null)
+  function B(b) {
+    var ce, fe;
+    const S = (fe = (ce = c == null ? void 0 : c.getSnapshot()) == null ? void 0 : ce.drawings) == null ? void 0 : fe[b.drawingId];
+    if (S == null)
       return;
     const {
-      distT: M = 0,
-      distL: E = 0,
-      distB: A = 0,
-      distR: U = 0,
-      layoutType: F = B.INLINE,
-      behindDoc: q = Me.FALSE,
-      wrapText: J = Ae.BOTH_SIDES
-    } = _;
-    if (D({
-      distT: M,
-      distL: E,
-      distB: A,
-      distR: U
-    }), O(J), f(F !== B.WRAP_SQUARE), F === B.WRAP_NONE || F === B.INLINE ? w(!0) : w(!1), F === B.WRAP_NONE || F === B.INLINE || F === B.WRAP_TOP_AND_BOTTOM ? I(!0) : I(!1), F === B.WRAP_NONE)
-      q === Me.TRUE ? P(re.BEHIND_TEXT) : P(re.IN_FRONT_OF_TEXT);
+      distT: A = 0,
+      distL: P = 0,
+      distB: L = 0,
+      distR: x = 0,
+      layoutType: M = k.INLINE,
+      behindDoc: W = oe.FALSE,
+      wrapText: G = je.BOTH_SIDES
+    } = S;
+    if (T({
+      distT: A,
+      distL: P,
+      distB: L,
+      distR: x
+    }), O(G), h(M !== k.WRAP_SQUARE), M === k.WRAP_NONE || M === k.INLINE ? w(!0) : w(!1), M === k.WRAP_NONE || M === k.INLINE || M === k.WRAP_TOP_AND_BOTTOM ? I(!0) : I(!1), M === k.WRAP_NONE)
+      W === oe.TRUE ? _(me.BEHIND_TEXT) : _(me.IN_FRONT_OF_TEXT);
     else
-      switch (F) {
-        case B.INLINE:
-          P(re.INLINE);
+      switch (M) {
+        case k.INLINE:
+          _(me.INLINE);
           break;
-        case B.WRAP_SQUARE:
-          P(re.WRAP_SQUARE);
+        case k.WRAP_SQUARE:
+          _(me.WRAP_SQUARE);
           break;
-        case B.WRAP_TOP_AND_BOTTOM:
-          P(re.WRAP_TOP_AND_BOTTOM);
+        case k.WRAP_TOP_AND_BOTTOM:
+          _(me.WRAP_TOP_AND_BOTTOM);
           break;
         default:
-          throw new Error(`Unsupported layout type: ${F}`);
+          throw new Error(`Unsupported layout type: ${M}`);
       }
   }
-  return gn(() => {
-    L();
-    const N = t.focus$.subscribe((M) => {
-      if (M.length === 0) {
-        y(!1);
+  return ht(() => {
+    U();
+    const b = n.focus$.subscribe((A) => {
+      if (A.length === 0) {
+        R(!1);
         return;
       }
-      y(!0), z(M[0]);
-    }), _ = e.onCommandExecuted(async (M) => {
-      M.id === Z.id && L();
+      R(!0), B(A[0]);
+    }), S = e.onCommandExecuted(async (A) => {
+      A.id === Q.id && U();
     });
     return () => {
-      N.unsubscribe(), _.dispose();
+      b.unsubscribe(), S.dispose();
     };
-  }, []), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelGrid, h.imageCommonPanelBorder), style: { display: b ? "block" : "none" } }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelTitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-text-wrap.title")))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-text-wrap.wrappingStyle")))), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelRow) }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn) }, /* @__PURE__ */ d.createElement(Mn, { value: C, onChange: T, direction: "vertical" }, /* @__PURE__ */ d.createElement(Ie, { value: re.INLINE }, n.t("image-text-wrap.inline")), /* @__PURE__ */ d.createElement(Ie, { value: re.WRAP_SQUARE }, n.t("image-text-wrap.square")), /* @__PURE__ */ d.createElement(Ie, { value: re.WRAP_TOP_AND_BOTTOM }, n.t("image-text-wrap.topAndBottom")), /* @__PURE__ */ d.createElement(Ie, { value: re.BEHIND_TEXT }, n.t("image-text-wrap.behindText")), /* @__PURE__ */ d.createElement(Ie, { value: re.IN_FRONT_OF_TEXT }, n.t("image-text-wrap.inFrontText"))))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-text-wrap.wrapText")))), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelRow) }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn) }, /* @__PURE__ */ d.createElement(Mn, { disabled: p, value: S, onChange: V, direction: "horizontal" }, /* @__PURE__ */ d.createElement(Ie, { value: Ae.BOTH_SIDES }, n.t("image-text-wrap.bothSide")), /* @__PURE__ */ d.createElement(Ie, { value: Ae.LEFT }, n.t("image-text-wrap.leftOnly")), /* @__PURE__ */ d.createElement(Ie, { value: Ae.RIGHT }, n.t("image-text-wrap.rightOnly"))))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-text-wrap.distanceFromText")))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-text-wrap.top"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    Te,
+  }, []), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelGrid, g.imageCommonPanelBorder), style: { display: N ? "block" : "none" } }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelTitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-text-wrap.title")))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-text-wrap.wrappingStyle")))), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelRow) }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn) }, /* @__PURE__ */ d.createElement(bt, { value: D, onChange: E, direction: "vertical" }, /* @__PURE__ */ d.createElement(Ee, { value: me.INLINE }, t.t("image-text-wrap.inline")), /* @__PURE__ */ d.createElement(Ee, { value: me.WRAP_SQUARE }, t.t("image-text-wrap.square")), /* @__PURE__ */ d.createElement(Ee, { value: me.WRAP_TOP_AND_BOTTOM }, t.t("image-text-wrap.topAndBottom")), /* @__PURE__ */ d.createElement(Ee, { value: me.BEHIND_TEXT }, t.t("image-text-wrap.behindText")), /* @__PURE__ */ d.createElement(Ee, { value: me.IN_FRONT_OF_TEXT }, t.t("image-text-wrap.inFrontText"))))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-text-wrap.wrapText")))), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelRow) }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn) }, /* @__PURE__ */ d.createElement(bt, { disabled: f, value: C, onChange: H, direction: "horizontal" }, /* @__PURE__ */ d.createElement(Ee, { value: je.BOTH_SIDES }, t.t("image-text-wrap.bothSide")), /* @__PURE__ */ d.createElement(Ee, { value: je.LEFT }, t.t("image-text-wrap.leftOnly")), /* @__PURE__ */ d.createElement(Ee, { value: je.RIGHT }, t.t("image-text-wrap.rightOnly"))))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-text-wrap.distanceFromText")))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-text-wrap.top"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Ae,
     {
-      min: je,
-      max: ke,
-      disabled: g,
+      min: Ze,
+      max: Qe,
+      disabled: p,
       precision: 1,
-      value: R.distT,
-      onChange: (N) => {
-        x(N, "distT");
+      value: y.distT,
+      onChange: (b) => {
+        z(b, "distT");
       },
-      className: h.imageCommonPanelInput
+      className: g.imageCommonPanelInput
     }
-  ))))), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-text-wrap.left"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    Te,
+  ))))), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-text-wrap.left"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Ae,
     {
-      min: je,
-      max: ke,
+      min: Ze,
+      max: Qe,
       disabled: v,
       precision: 1,
-      value: R.distL,
-      onChange: (N) => {
-        x(N, "distL");
+      value: y.distL,
+      onChange: (b) => {
+        z(b, "distL");
       },
-      className: h.imageCommonPanelInput
+      className: g.imageCommonPanelInput
     }
-  )))))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-text-wrap.bottom"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    Te,
+  )))))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-text-wrap.bottom"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Ae,
     {
-      min: je,
-      max: ke,
-      disabled: g,
+      min: Ze,
+      max: Qe,
+      disabled: p,
       precision: 1,
-      value: R.distB,
-      onChange: (N) => {
-        x(N, "distB");
+      value: y.distB,
+      onChange: (b) => {
+        z(b, "distB");
       },
-      className: h.imageCommonPanelInput
+      className: g.imageCommonPanelInput
     }
-  ))))), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-text-wrap.right"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    Te,
+  ))))), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-text-wrap.right"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Ae,
     {
-      min: je,
-      max: ke,
+      min: Ze,
+      max: Qe,
       disabled: v,
       precision: 1,
-      value: R.distR,
-      onChange: (N) => {
-        x(N, "distR");
+      value: y.distR,
+      onChange: (b) => {
+        z(b, "distR");
       },
-      className: h.imageCommonPanelInput
+      className: g.imageCommonPanelInput
     }
   )))))));
-}, Rn = -1e3, Nn = 1e3, Ni = (i) => {
-  const e = ie(W), n = ie(en), t = ie(ge), o = ie(Q), r = ie(X), a = ie(Le), { drawings: s } = i, l = s[0];
+}, xt = -1e3, Lt = 1e3, ki = (i) => {
+  const e = re($), t = re(ot), n = re(he), r = re(se), o = re(te), a = re(Ue), { drawings: s } = i, l = s[0];
   if (l == null)
     return;
-  const { unitId: c } = l, m = r.getUniverDocInstance(c), u = o.getRenderById(c), p = u == null ? void 0 : u.scene;
-  if (p == null)
+  const { unitId: c } = l, m = o.getUniverDocInstance(c), u = r.getRenderById(c), f = u == null ? void 0 : u.scene;
+  if (f == null)
     return;
-  const f = p.getTransformerByCreate(), g = [{
-    label: n.t("image-position.column"),
-    value: String(Y.COLUMN)
+  const h = f.getTransformerByCreate(), p = [{
+    label: t.t("image-position.column"),
+    value: String(ee.COLUMN)
   }, {
-    label: n.t("image-position.page"),
-    value: String(Y.PAGE)
+    label: t.t("image-position.page"),
+    value: String(ee.PAGE)
   }, {
-    label: n.t("image-position.margin"),
-    value: String(Y.MARGIN)
+    label: t.t("image-position.margin"),
+    value: String(ee.MARGIN)
   }], w = [{
-    label: n.t("image-position.line"),
-    value: String(G.LINE)
+    label: t.t("image-position.line"),
+    value: String(V.LINE)
   }, {
-    label: n.t("image-position.page"),
-    value: String(G.PAGE)
+    label: t.t("image-position.page"),
+    value: String(V.PAGE)
   }, {
-    label: n.t("image-position.margin"),
-    value: String(G.MARGIN)
+    label: t.t("image-position.margin"),
+    value: String(V.MARGIN)
   }, {
-    label: n.t("image-position.paragraph"),
-    value: String(G.PARAGRAPH)
-  }], [v, I] = te(!0), [C, P] = te({
-    relativeFrom: Y.PAGE,
+    label: t.t("image-position.paragraph"),
+    value: String(V.PARAGRAPH)
+  }], [v, I] = ie(!0), [D, _] = ie({
+    relativeFrom: ee.PAGE,
     posOffset: 0
-  }), [S, O] = te({
-    relativeFrom: G.PAGE,
+  }), [C, O] = ie({
+    relativeFrom: V.PAGE,
     posOffset: 0
-  }), [R, D] = te(!0), [b, y] = te(!0);
-  function T(_, M) {
-    _ === "positionH" ? P(M) : O(M);
-    const E = t.getFocusDrawings();
-    if (E.length === 0)
+  }), [y, T] = ie(!0), [N, R] = ie(!0);
+  function E(S, A) {
+    S === "positionH" ? _(A) : O(A);
+    const P = n.getFocusDrawings();
+    if (P.length === 0)
       return;
-    const A = E.map((U) => ({
-      unitId: U.unitId,
-      subUnitId: U.subUnitId,
-      drawingId: U.drawingId
+    const L = P.map((x) => ({
+      unitId: x.unitId,
+      subUnitId: x.subUnitId,
+      drawingId: x.drawingId
     }));
-    e.executeCommand(xe.id, {
-      unitId: E[0].unitId,
-      subUnitId: E[0].unitId,
-      drawings: A.map((U) => ({
-        drawingId: U.drawingId,
-        key: _,
-        value: M
+    e.executeCommand(ze.id, {
+      unitId: P[0].unitId,
+      subUnitId: P[0].unitId,
+      drawings: L.map((x) => ({
+        drawingId: x.drawingId,
+        key: S,
+        value: A
       }))
-    }), a.blur(), f.refreshControls();
+    }), a.blur(), h.refreshControls();
   }
-  function V(_) {
-    var ee;
-    const M = C.relativeFrom, E = C.posOffset, A = Number(_);
-    if (M === A)
+  function H(S) {
+    var we, ve, ne;
+    const A = D.relativeFrom, P = D.posOffset, L = Number(S);
+    if (A === L)
       return;
-    const U = t.getFocusDrawings();
-    if (U.length === 0)
+    const x = n.getFocusDrawings();
+    if (x.length === 0)
       return;
-    const F = U[0].drawingId, q = U[0].unitId;
-    let J = null, ue = 0;
-    const ce = (ee = o.getRenderById(q)) == null ? void 0 : ee.with(me).getSkeleton(), pe = ce == null ? void 0 : ce.getSkeletonData();
-    if (pe == null)
+    const M = x[0].drawingId, W = x[0].unitId;
+    let G = null, F = 0;
+    const ce = (we = r.getRenderById(W)) == null ? void 0 : we.with(ae).getSkeleton(), fe = ce == null ? void 0 : ce.getSkeletonData();
+    if (fe == null)
       return;
-    for (const we of pe.pages) {
-      const { marginLeft: ve, skeDrawings: ne } = we;
-      if (ne.has(F)) {
-        J = ne.get(F), ue = ve;
+    const { pages: Oe, skeHeaders: Be, skeFooters: Ce } = fe;
+    for (const Ne of Oe) {
+      const { marginLeft: Ie, skeDrawings: Se, headerId: Te, footerId: Me, pageWidth: De } = Ne;
+      if (Se.has(M)) {
+        G = Se.get(M), F = Ie;
+        break;
+      }
+      const J = (ve = Be.get(Te)) == null ? void 0 : ve.get(De);
+      if (J != null && J.skeDrawings.has(M)) {
+        G = J == null ? void 0 : J.skeDrawings.get(M), F = Ie;
+        break;
+      }
+      const q = (ne = Ce.get(Me)) == null ? void 0 : ne.get(De);
+      if (q != null && q.skeDrawings.has(M)) {
+        G = q == null ? void 0 : q.skeDrawings.get(M), F = Ie;
         break;
       }
     }
-    if (J == null)
+    if (G == null)
       return;
-    let oe = 0;
-    M === Y.COLUMN ? oe -= J.columnLeft : M === Y.MARGIN && (oe -= ue), A === Y.COLUMN ? oe += J.columnLeft : A === Y.MARGIN ? oe += ue : Y.PAGE;
-    const K = {
-      relativeFrom: A,
-      posOffset: (E != null ? E : 0) - oe
+    let K = 0;
+    A === ee.COLUMN ? K -= G.columnLeft : A === ee.MARGIN && (K -= F), L === ee.COLUMN ? K += G.columnLeft : L === ee.MARGIN ? K += F : ee.PAGE;
+    const le = {
+      relativeFrom: L,
+      posOffset: (P != null ? P : 0) - K
     };
-    T("positionH", K);
+    E("positionH", le);
   }
-  function x(_) {
-    var Ge, fn, hn, wn, vn;
-    const M = S.relativeFrom, E = S.posOffset, A = Number(_);
-    if (M === A)
+  function z(S) {
+    var Ie, Se, Te, Me, De;
+    const A = C.relativeFrom, P = C.posOffset, L = Number(S);
+    if (A === L)
       return;
-    const U = t.getFocusDrawings();
-    if (U.length === 0)
+    const x = n.getFocusDrawings();
+    if (x.length === 0)
       return;
-    const { drawingId: F, unitId: q } = U[0], J = r.getUniverDocInstance(q), ue = (Ge = o.getRenderById(q)) == null ? void 0 : Ge.with(me).getSkeleton(), ce = (hn = (fn = J == null ? void 0 : J.getBody()) == null ? void 0 : fn.customBlocks) == null ? void 0 : hn.find((We) => We.blockId === F);
-    if (ce == null || ue == null)
+    const { drawingId: M, unitId: W } = x[0], G = o.getUniverDocInstance(W), F = (Ie = r.getRenderById(W)) == null ? void 0 : Ie.with(ae).getSkeleton(), ce = a.getSegment(), fe = a.getSegmentPage(), Oe = (Te = (Se = G == null ? void 0 : G.getSelfOrHeaderFooterModel(ce).getBody()) == null ? void 0 : Se.customBlocks) == null ? void 0 : Te.find((J) => J.blockId === M);
+    if (Oe == null || F == null)
       return;
-    const { startIndex: pe } = ce, oe = ue.findNodeByCharIndex(pe), K = (wn = oe == null ? void 0 : oe.parent) == null ? void 0 : wn.parent, ee = K == null ? void 0 : K.parent, we = ee == null ? void 0 : ee.lines.find((We) => We.paragraphIndex === (K == null ? void 0 : K.paragraphIndex) && We.paragraphStart), ve = (vn = ee == null ? void 0 : ee.parent) == null ? void 0 : vn.parent;
-    if (oe == null || K == null || we == null || ee == null || ve == null)
+    const { startIndex: Be } = Oe, Ce = F.findNodeByCharIndex(Be, ce, fe), K = (Me = Ce == null ? void 0 : Ce.parent) == null ? void 0 : Me.parent, le = K == null ? void 0 : K.parent, we = le == null ? void 0 : le.lines.find((J) => J.paragraphIndex === (K == null ? void 0 : K.paragraphIndex) && J.paragraphStart), ve = (De = le == null ? void 0 : le.parent) == null ? void 0 : De.parent;
+    if (Ce == null || K == null || we == null || le == null || ve == null)
       return;
     let ne = 0;
-    M === G.PARAGRAPH ? ne -= we.top : M === G.LINE ? ne -= K.top : M === G.PAGE && (ne += ve.marginTop), A === G.PARAGRAPH ? ne += we.top : A === G.LINE ? ne += K.top : A === G.PAGE && (ne -= ve.marginTop);
-    const le = {
-      relativeFrom: A,
-      posOffset: (E != null ? E : 0) - ne
+    A === V.PARAGRAPH ? ne -= we.top : A === V.LINE ? ne -= K.top : A === V.PAGE && (ne += ve.marginTop), L === V.PARAGRAPH ? ne += we.top : L === V.LINE ? ne += K.top : L === V.PAGE && (ne -= ve.marginTop);
+    const Ne = {
+      relativeFrom: L,
+      posOffset: (P != null ? P : 0) - ne
     };
-    T("positionV", le);
+    E("positionV", Ne);
   }
-  function L(_) {
-    var q;
-    const M = m == null ? void 0 : m.getSnapshot(), E = (q = M == null ? void 0 : M.drawings) == null ? void 0 : q[_.drawingId];
-    if (E == null)
+  function U(S) {
+    var W;
+    const A = m == null ? void 0 : m.getSnapshot(), P = (W = A == null ? void 0 : A.drawings) == null ? void 0 : W[S.drawingId];
+    if (P == null)
       return;
-    const { layoutType: A } = E, {
-      positionH: U,
-      positionV: F
-    } = E.docTransform;
-    P(U), O(F), I(A === B.INLINE), D(F.relativeFrom === G.PARAGRAPH || F.relativeFrom === G.LINE);
-  }
-  function z() {
-    const _ = t.getFocusDrawings();
-    _.length !== 0 && L(_[0]);
-  }
-  function N(_) {
-    D(_), x(String(_ ? G.PARAGRAPH : G.PAGE));
-  }
-  return gn(() => {
-    z();
-    const _ = t.focus$.subscribe((E) => {
-      if (E.length === 0) {
-        y(!1);
+    const { layoutType: L } = P, {
+      positionH: x,
+      positionV: M
+    } = P.docTransform;
+    _(x), O(M), I(L === k.INLINE), T(M.relativeFrom === V.PARAGRAPH || M.relativeFrom === V.LINE);
+  }
+  function B() {
+    const S = n.getFocusDrawings();
+    S.length !== 0 && U(S[0]);
+  }
+  function b(S) {
+    T(S), z(String(S ? V.PARAGRAPH : V.PAGE));
+  }
+  return ht(() => {
+    B();
+    const S = n.focus$.subscribe((P) => {
+      if (P.length === 0) {
+        R(!1);
         return;
       }
-      y(!0), L(E[0]);
-    }), M = e.onCommandExecuted(async (E) => {
-      E.id === Z.id && z();
+      R(!0), U(P[0]);
+    }), A = e.onCommandExecuted(async (P) => {
+      P.id === Q.id && B();
     });
     return () => {
-      _.unsubscribe(), M.dispose();
+      S.unsubscribe(), A.dispose();
     };
-  }, []), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelGrid, h.imageCommonPanelBorder), style: { display: b ? "block" : "none" } }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelTitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-position.title")))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-position.horizontal")))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-position.absolutePosition"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    Te,
+  }, []), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelGrid, g.imageCommonPanelBorder), style: { display: N ? "block" : "none" } }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelTitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-position.title")))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-position.horizontal")))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-position.absolutePosition"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Ae,
     {
-      min: Rn,
-      max: Nn,
+      min: xt,
+      max: Lt,
       precision: 1,
       disabled: v,
-      value: C.posOffset,
-      onChange: (_) => {
-        T("positionH", {
-          relativeFrom: C.relativeFrom,
-          posOffset: _
+      value: D.posOffset,
+      onChange: (S) => {
+        E("positionH", {
+          relativeFrom: D.relativeFrom,
+          posOffset: S
         });
       },
-      className: h.imageCommonPanelInput
+      className: g.imageCommonPanelInput
     }
-  ))))), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-position.toTheRightOf"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    yn,
+  ))))), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-position.toTheRightOf"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Rt,
     {
-      value: String(C.relativeFrom),
+      value: String(D.relativeFrom),
       disabled: v,
-      options: g,
-      onChange: V
+      options: p,
+      onChange: H
     }
-  )))))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-position.vertical")))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-position.absolutePosition"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    Te,
+  )))))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-position.vertical")))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-position.absolutePosition"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Ae,
     {
-      min: Rn,
-      max: Nn,
+      min: xt,
+      max: Lt,
       precision: 1,
       disabled: v,
-      value: S.posOffset,
-      onChange: (_) => {
-        T("positionV", {
-          relativeFrom: S.relativeFrom,
-          posOffset: _
+      value: C.posOffset,
+      onChange: (S) => {
+        E("positionV", {
+          relativeFrom: C.relativeFrom,
+          posOffset: S
         });
       },
-      className: h.imageCommonPanelInput
+      className: g.imageCommonPanelInput
     }
-  ))))), /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, n.t("image-position.bellow"))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
-    yn,
+  ))))), /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSpan2) }, /* @__PURE__ */ d.createElement("label", null, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, t.t("image-position.bellow"))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(
+    Rt,
     {
       disabled: v,
-      value: String(S.relativeFrom),
+      value: String(C.relativeFrom),
       options: w,
-      onChange: x
+      onChange: z
     }
-  )))))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: H(h.imageCommonPanelColumn, h.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, n.t("image-position.options")))), /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelRow, style: { marginBottom: "50px" } }, /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(ei, { disabled: v, checked: R, onChange: N }, n.t("image-position.moveObjectWithText")))));
-}, Ai = () => {
-  const i = ie(ge), e = i.getFocusDrawings(), [n, t] = te(e);
-  return gn(() => {
-    const o = i.focus$.subscribe((r) => {
-      t(r);
+  )))))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow }, /* @__PURE__ */ d.createElement("div", { className: j(g.imageCommonPanelColumn, g.imageCommonPanelSubtitle) }, /* @__PURE__ */ d.createElement("div", null, t.t("image-position.options")))), /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelRow, style: { marginBottom: "50px" } }, /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanelColumn }, /* @__PURE__ */ d.createElement(si, { disabled: v, checked: y, onChange: b }, t.t("image-position.moveObjectWithText")))));
+}, Hi = () => {
+  const i = re(he), e = i.getFocusDrawings(), [t, n] = ie(e);
+  return ht(() => {
+    const r = i.focus$.subscribe((o) => {
+      n(o);
     });
     return () => {
-      o.unsubscribe();
+      r.unsubscribe();
     };
-  }, []), !!(n != null && n.length) && /* @__PURE__ */ d.createElement("div", { className: h.imageCommonPanel }, /* @__PURE__ */ d.createElement(Pt, { drawings: n, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }), /* @__PURE__ */ d.createElement(Ri, { drawings: n }), /* @__PURE__ */ d.createElement(Ni, { drawings: n }));
-}, Oe = {
+  }, []), !!(t != null && t.length) && /* @__PURE__ */ d.createElement("div", { className: g.imageCommonPanel }, /* @__PURE__ */ d.createElement(Nn, { drawings: t, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }), /* @__PURE__ */ d.createElement(Fi, { drawings: t }), /* @__PURE__ */ d.createElement(ki, { drawings: t }));
+}, Wi = {
   id: "doc.operation.clear-drawing-transformer",
-  type: $.MUTATION,
+  type: Y.MUTATION,
   handler: (i, e) => {
-    const n = i.get(Q);
-    return e.forEach((t) => {
-      var o, r;
-      (r = (o = n.getRenderById(t)) == null ? void 0 : o.scene.getTransformer()) == null || r.debounceRefreshControls();
+    const t = i.get(se);
+    return e.forEach((n) => {
+      var r, o;
+      (o = (r = t.getRenderById(n)) == null ? void 0 : r.scene.getTransformer()) == null || o.debounceRefreshControls();
     }), !0;
   }
-}, Fe = {
+}, Xe = {
   id: "doc.command.move-drawing",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
-    const n = i.get(W), t = i.get(De), o = i.get(X), r = i.get(Q), { direction: a } = e, s = t.getFocusDrawings();
+    const t = i.get($), n = i.get(Re), r = i.get(te), o = i.get(se), { direction: a } = e, s = n.getFocusDrawings();
     if (s.length === 0)
       return !1;
-    const l = s[0].unitId, c = r.getRenderById(l), m = c == null ? void 0 : c.scene;
+    const l = s[0].unitId, c = o.getRenderById(l), m = c == null ? void 0 : c.scene;
     if (m == null)
       return !1;
-    const u = m.getTransformerByCreate(), p = o.getUniverDocInstance(l), f = s.map((w) => {
-      var R, D, b, y, T;
-      const { drawingId: v } = w, I = (R = p == null ? void 0 : p.getSnapshot().drawings) == null ? void 0 : R[v];
-      if (I == null || I.layoutType === B.INLINE)
+    const u = m.getTransformerByCreate(), f = r.getUniverDocInstance(l), h = s.map((w) => {
+      var y, T, N, R, E;
+      const { drawingId: v } = w, I = (y = f == null ? void 0 : f.getSnapshot().drawings) == null ? void 0 : y[v];
+      if (I == null || I.layoutType === k.INLINE)
         return null;
-      const { positionH: C, positionV: P } = I.docTransform, S = { ...C }, O = { ...P };
-      return a === ae.UP ? O.posOffset = ((D = O.posOffset) != null ? D : 0) - 2 : a === ae.DOWN ? O.posOffset = ((b = O.posOffset) != null ? b : 0) + 2 : a === ae.LEFT ? S.posOffset = ((y = S.posOffset) != null ? y : 0) - 2 : a === ae.RIGHT && (S.posOffset = ((T = S.posOffset) != null ? T : 0) + 2), {
+      const { positionH: D, positionV: _ } = I.docTransform, C = { ...D }, O = { ..._ };
+      return a === ge.UP ? O.posOffset = ((T = O.posOffset) != null ? T : 0) - 2 : a === ge.DOWN ? O.posOffset = ((N = O.posOffset) != null ? N : 0) + 2 : a === ge.LEFT ? C.posOffset = ((R = C.posOffset) != null ? R : 0) - 2 : a === ge.RIGHT && (C.posOffset = ((E = C.posOffset) != null ? E : 0) + 2), {
         drawingId: v,
-        key: a === ae.UP || a === ae.DOWN ? "positionV" : "positionH",
-        value: a === ae.UP || a === ae.DOWN ? O : S
+        key: a === ge.UP || a === ge.DOWN ? "positionV" : "positionH",
+        value: a === ge.UP || a === ge.DOWN ? O : C
       };
     }).filter((w) => w != null);
-    if (f.length === 0)
+    if (h.length === 0)
       return !1;
-    const g = n.syncExecuteCommand(xe.id, {
+    const p = t.syncExecuteCommand(ze.id, {
       unitId: l,
       subUnitId: l,
-      drawings: f
+      drawings: h
     });
-    return u.refreshControls(), !!g;
+    return u.refreshControls(), !!p;
   }
-}, tt = {
+}, cn = {
   id: "doc.command.delete-drawing",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i) => {
-    const e = i.get(W), t = i.get(De).getFocusDrawings();
-    if (t.length === 0)
+    const e = i.get($), n = i.get(Re).getFocusDrawings();
+    if (n.length === 0)
       return !1;
-    const { unitId: o } = t[0], r = t.map((a) => {
+    const { unitId: r } = n[0], o = n.map((a) => {
       const { unitId: s, subUnitId: l, drawingId: c, drawingType: m } = a;
       return {
         unitId: s,
@@ -1144,326 +1168,223 @@ const bi = {
         drawingType: m
       };
     });
-    return e.executeCommand(pn.id, {
-      unitId: o,
-      drawings: r
+    return e.executeCommand(wt.id, {
+      unitId: r,
+      drawings: o
     });
   }
-}, it = {
+}, ln = {
   id: "doc.command.set-drawing-arrange",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
-    const n = i.get(W), t = i.get(De);
+    const t = i.get($), n = i.get(Re);
     if (e == null)
       return !1;
-    const { unitId: o, subUnitId: r, drawingIds: a, arrangeType: s } = e, l = { unitId: o, subUnitId: r, drawingIds: a };
+    const { unitId: r, subUnitId: o, drawingIds: a, arrangeType: s } = e, l = { unitId: r, subUnitId: o, drawingIds: a };
     let c;
-    if (s === He.forward ? c = t.getForwardDrawingsOp(l) : s === He.backward ? c = t.getBackwardDrawingOp(l) : s === He.front ? c = t.getFrontDrawingsOp(l) : s === He.back && (c = t.getBackDrawingsOp(l)), c == null)
+    if (s === Ye.forward ? c = n.getForwardDrawingsOp(l) : s === Ye.backward ? c = n.getBackwardDrawingOp(l) : s === Ye.front ? c = n.getFrontDrawingsOp(l) : s === Ye.back && (c = n.getBackDrawingsOp(l)), c == null)
       return !1;
     const { redo: m } = c;
     if (m == null)
       return !1;
     const u = [];
-    let p = _e.deepClone(m);
-    p = p.slice(3), p.unshift("drawingsOrder"), u.push(p);
-    const f = {
-      id: Z.id,
+    let f = Pe.deepClone(m);
+    f = f.slice(3), f.unshift("drawingsOrder"), u.push(f);
+    const h = {
+      id: Q.id,
       params: {
-        unitId: o,
+        unitId: r,
         actions: [],
         textRanges: null
       }
     };
-    return f.params.actions = u.reduce((w, v) => k.compose(w, v), null), !!n.syncExecuteCommand(f.id, f.params);
-  }
-}, ot = {
-  id: "doc.command.set-doc-image",
-  type: $.COMMAND,
-  handler: (i, e) => {
-    const n = i.get(W), t = i.get(mn), o = i.get(De);
-    if (!e) return !1;
-    const { drawings: r } = e, a = o.getBatchUpdateOp(r), { unitId: s, subUnitId: l, undo: c, redo: m, objects: u } = a;
-    return n.syncExecuteCommand(fe.id, { unitId: s, subUnitId: l, op: m, objects: u, type: he.UPDATE }) ? (t.pushUndoRedo({
-      unitID: s,
-      undoMutations: [
-        { id: fe.id, params: { unitId: s, subUnitId: l, op: c, objects: u, type: he.UPDATE } },
-        { id: Oe.id, params: [s] }
-      ],
-      redoMutations: [
-        { id: fe.id, params: { unitId: s, subUnitId: l, op: m, objects: u, type: he.UPDATE } },
-        { id: Oe.id, params: [s] }
-      ]
-    }), !0) : !1;
+    return h.params.actions = u.reduce((w, v) => X.compose(w, v), null), !!t.syncExecuteCommand(h.id, h.params);
   }
-};
-function xi(i) {
-  const e = [];
-  return i.forEach((n) => {
-    const { parent: t, children: o } = n, { unitId: r, subUnitId: a, drawingId: s } = t, l = Nt(0, 0, o.map((u) => u.transform || {})), c = o.map((u) => {
-      const p = u.transform || { left: 0, top: 0 }, { unitId: f, subUnitId: g, drawingId: w } = u;
-      return {
-        unitId: f,
-        subUnitId: g,
-        drawingId: w,
-        transform: {
-          ...p,
-          left: p.left - l.left,
-          top: p.top - l.top
-        },
-        groupId: s
-      };
-    }), m = {
-      unitId: r,
-      subUnitId: a,
-      drawingId: s,
-      drawingType: un.DRAWING_GROUP,
-      transform: l
-    };
-    e.push({
-      parent: m,
-      children: c
-    });
-  }), e;
-}
-function Ui(i) {
-  const e = [];
-  return i.forEach((n) => {
-    const { parent: t, children: o } = n, { unitId: r, subUnitId: a, drawingId: s, transform: l = { width: 0, height: 0 } } = t;
-    if (l == null)
-      return;
-    const c = o.map((u) => {
-      const { transform: p } = u, { unitId: f, subUnitId: g, drawingId: w } = u, v = At(p || {}, l, l.width || 0, l.height || 0);
-      return {
-        unitId: f,
-        subUnitId: g,
-        drawingId: w,
-        transform: v,
-        groupId: void 0
-      };
-    }), m = {
-      unitId: r,
-      subUnitId: a,
-      drawingId: s,
-      drawingType: un.DRAWING_GROUP,
-      transform: {
-        left: 0,
-        top: 0
-      }
-    };
-    e.push({
-      parent: m,
-      children: c
-    });
-  }), e;
-}
-const rt = {
+}, dn = {
   id: "doc.command.ungroup-doc-image",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
-    const n = i.get(W), t = i.get(mn), o = i.get(De);
+    i.get($), i.get(Ft);
+    const t = i.get(Re);
     if (!e) return !1;
-    const r = [];
-    e.forEach(({ parent: f, children: g }) => {
-      r.push(f.unitId), g.forEach((w) => {
-        r.push(w.unitId);
+    const n = [];
+    return e.forEach(({ parent: r, children: o }) => {
+      n.push(r.unitId), o.forEach((a) => {
+        n.push(a.unitId);
       });
-    });
-    const a = o.getUngroupDrawingOp(e), { unitId: s, subUnitId: l, undo: c, redo: m, objects: u } = a;
-    return n.syncExecuteCommand(fe.id, { op: m, unitId: s, subUnitId: l, objects: u, type: he.UNGROUP }) ? (t.pushUndoRedo({
-      unitID: s,
-      undoMutations: [
-        { id: fe.id, params: { op: c, unitId: s, subUnitId: l, objects: xi(u), type: he.GROUP } },
-        { id: Oe.id, params: r }
-      ],
-      redoMutations: [
-        { id: fe.id, params: { op: m, unitId: s, subUnitId: l, objects: u, type: he.UNGROUP } },
-        { id: Oe.id, params: r }
-      ]
-    }), !0) : !1;
-  }
-}, at = {
+    }), t.getUngroupDrawingOp(e), !1;
+  }
+}, mn = {
   id: "doc.command.group-doc-image",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   handler: (i, e) => {
-    const n = i.get(W), t = i.get(mn), o = i.get(De);
+    i.get($), i.get(Ft);
+    const t = i.get(Re);
     if (!e) return !1;
-    const r = [];
-    e.forEach(({ parent: f, children: g }) => {
-      r.push(f.unitId), g.forEach((w) => {
-        r.push(w.unitId);
+    const n = [];
+    return e.forEach(({ parent: r, children: o }) => {
+      n.push(r.unitId), o.forEach((a) => {
+        n.push(a.unitId);
       });
-    });
-    const a = o.getGroupDrawingOp(e), { unitId: s, subUnitId: l, undo: c, redo: m, objects: u } = a;
-    return n.syncExecuteCommand(fe.id, { op: m, unitId: s, subUnitId: l, objects: u, type: he.GROUP }) ? (t.pushUndoRedo({
-      unitID: s,
-      undoMutations: [
-        { id: fe.id, params: { op: c, unitId: s, subUnitId: l, objects: Ui(u), type: he.UNGROUP } },
-        { id: Oe.id, params: r }
-      ],
-      redoMutations: [
-        { id: fe.id, params: { op: m, unitId: s, subUnitId: l, objects: u, type: he.GROUP } },
-        { id: Oe.id, params: r }
-      ]
-    }), !0) : !1;
-  }
-}, st = {
+    }), t.getGroupDrawingOp(e), !1;
+  }
+}, gn = {
   id: "doc.command.insert-doc-image",
-  type: $.COMMAND,
+  type: Y.COMMAND,
   // eslint-disable-next-line max-lines-per-function
   handler: (i, e) => {
-    var O, R;
+    var O, y;
     if (e == null)
       return !1;
-    const n = i.get(W), t = i.get(cn), o = i.get(X), r = t.getActiveRange(), a = o.getCurrentUniverDocInstance();
-    if (r == null || a == null)
+    const t = i.get($), n = i.get(gt), r = i.get(te), o = n.getActiveRange(), a = r.getCurrentUniverDocInstance();
+    if (o == null || a == null)
       return !1;
-    const s = a.getUnitId(), { drawings: l } = e, { collapsed: c, startOffset: m, segmentId: u } = r, p = a.getSelfOrHeaderFooterModel(u).getBody();
-    if (p == null)
+    const s = a.getUnitId(), { drawings: l } = e, { collapsed: c, startOffset: m, segmentId: u } = o, f = a.getSelfOrHeaderFooterModel(u).getBody();
+    if (f == null)
       return !1;
-    const f = new Je(), g = k.getInstance(), w = [], v = (R = (O = a.getSnapshot().drawingsOrder) == null ? void 0 : O.length) != null ? R : 0;
+    const h = new pt(), p = X.getInstance(), w = [], v = (y = (O = a.getSnapshot().drawingsOrder) == null ? void 0 : O.length) != null ? y : 0;
     if (c)
-      m > 0 && f.push({
-        t: j.RETAIN,
+      m > 0 && h.push({
+        t: Z.RETAIN,
         len: m,
         segmentId: u
       });
     else {
-      const { dos: D } = jt(r, u, 0, p);
-      f.push(...D);
+      const { dos: T } = Yn(o, u, 0, f);
+      h.push(...T);
     }
-    f.push({
-      t: j.INSERT,
+    h.push({
+      t: Z.INSERT,
       body: {
         dataStream: "\b".repeat(l.length),
-        customBlocks: l.map((D, b) => ({
-          startIndex: b,
-          blockId: D.drawingId
+        customBlocks: l.map((T, N) => ({
+          startIndex: N,
+          blockId: T.drawingId
         }))
       },
       len: l.length,
       line: 0,
       segmentId: u
     });
-    const I = on(a, u), C = g.editOp(f.serialize(), I);
-    w.push(C);
-    for (const D of l) {
-      const { drawingId: b } = D, y = g.insertOp(["drawings", b], D), T = g.insertOp(["drawingsOrder", v], b);
-      w.push(y), w.push(T);
+    const I = $e(a, u), D = p.editOp(h.serialize(), I);
+    w.push(D);
+    for (const T of l) {
+      const { drawingId: N } = T, R = p.insertOp(["drawings", N], T), E = p.insertOp(["drawingsOrder", v], N);
+      w.push(R), w.push(E);
     }
-    const P = {
-      id: Z.id,
+    const _ = {
+      id: Q.id,
       params: {
         unitId: s,
         actions: [],
         textRanges: []
       }
     };
-    return P.params.actions = w.reduce((D, b) => k.compose(D, b), null), !!n.syncExecuteCommand(P.id, P.params);
+    return _.params.actions = w.reduce((T, N) => X.compose(T, N), null), !!t.syncExecuteCommand(_.id, _.params);
   }
 };
-function Be(i) {
-  return i.getContextValue(pt) && i.getContextValue(Ze);
+function Ke(i) {
+  return i.getContextValue(Sn) && i.getContextValue(it);
 }
-const Li = {
-  id: Fe.id,
+const Gi = {
+  id: Xe.id,
   description: "shortcut.doc.drawing-move-down",
   group: "4_doc-drawing-view",
-  binding: ye.ARROW_DOWN,
+  binding: Le.ARROW_DOWN,
   priority: 100,
-  preconditions: Be,
+  preconditions: Ke,
   staticParameters: {
-    direction: ae.DOWN
+    direction: ge.DOWN
   }
-}, Fi = {
-  id: Fe.id,
+}, Vi = {
+  id: Xe.id,
   description: "shortcut.doc.drawing-move-up",
   group: "4_doc-drawing-view",
-  binding: ye.ARROW_UP,
+  binding: Le.ARROW_UP,
   priority: 100,
-  preconditions: Be,
+  preconditions: Ke,
   staticParameters: {
-    direction: ae.UP
+    direction: ge.UP
   }
-}, Bi = {
-  id: Fe.id,
+}, ji = {
+  id: Xe.id,
   description: "shortcut.doc.drawing-move-left",
   group: "4_doc-drawing-view",
-  binding: ye.ARROW_LEFT,
+  binding: Le.ARROW_LEFT,
   priority: 100,
-  preconditions: Be,
+  preconditions: Ke,
   staticParameters: {
-    direction: ae.LEFT
+    direction: ge.LEFT
   }
-}, Gi = {
-  id: Fe.id,
+}, $i = {
+  id: Xe.id,
   description: "shortcut.doc.drawing-move-right",
   group: "4_doc-drawing-view",
-  binding: ye.ARROW_RIGHT,
+  binding: Le.ARROW_RIGHT,
   priority: 100,
-  preconditions: Be,
+  preconditions: Ke,
   staticParameters: {
-    direction: ae.RIGHT
+    direction: ge.RIGHT
   }
-}, Wi = {
-  id: tt.id,
+}, zi = {
+  id: cn.id,
   description: "shortcut.doc.drawing-delete",
   group: "4_doc-drawing-view",
   // when focusing on any other input tag do not trigger this shortcut
-  preconditions: Be,
-  binding: ye.DELETE,
-  mac: ye.BACKSPACE
+  preconditions: Ke,
+  binding: Le.DELETE,
+  mac: Le.BACKSPACE
 };
-var Hi = Object.defineProperty, Vi = Object.getOwnPropertyDescriptor, ji = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? Vi(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && Hi(e, n, o), o;
-}, Re = (i, e) => (n, t) => e(n, t, i);
-let qe = class extends Ue {
-  constructor(i, e, n, t, o) {
-    super(), this._injector = i, this._componentManager = e, this._menuService = n, this._commandService = t, this._shortcutService = o, this._init();
+var qi = Object.defineProperty, Xi = Object.getOwnPropertyDescriptor, Ki = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Xi(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && qi(e, t, r), r;
+}, He = (i, e) => (t, n) => e(t, n, i);
+let et = class extends qe {
+  constructor(i, e, t, n, r) {
+    super(), this._injector = i, this._componentManager = e, this._menuService = t, this._commandService = n, this._shortcutService = r, this._init();
   }
   _initCustomComponents() {
     const i = this._componentManager;
-    this.disposeWithMe(i.register(Kn, Xn)), this.disposeWithMe(i.register(qn, mi)), this.disposeWithMe(i.register(Vn, Ai));
+    this.disposeWithMe(i.register(Jt, Zt)), this.disposeWithMe(i.register(Qt, vi)), this.disposeWithMe(i.register(zt, Hi));
   }
   _initMenus() {
     [
-      gi,
-      pi
+      _i,
+      Ci
     ].forEach((i) => {
       this.disposeWithMe(this._menuService.addMenuItem(this._injector.invoke(i), {}));
     });
   }
   _initCommands() {
     [
+      vt,
+      gn,
+      nn,
       rn,
-      st,
-      Zn,
-      Qn,
-      Jn,
-      xe,
-      et,
-      nt,
-      pn,
-      ot,
-      jn,
-      Oe,
-      kn,
-      at,
-      rt,
-      Fe,
-      tt,
-      it
+      on,
+      ze,
+      an,
+      sn,
+      wt,
+      qt,
+      Wi,
+      Xt,
+      mn,
+      dn,
+      Xe,
+      cn,
+      ln
     ].forEach((i) => this.disposeWithMe(this._commandService.registerCommand(i)));
   }
   _initShortcuts() {
     [
       // sheet drawing shortcuts
-      Li,
-      Fi,
-      Bi,
       Gi,
-      Wi
+      Vi,
+      ji,
+      $i,
+      zi
     ].forEach((i) => {
       this.disposeWithMe(this._shortcutService.registerShortcut(i));
     });
@@ -1472,22 +1393,22 @@ let qe = class extends Ue {
     this._initCommands(), this._initCustomComponents(), this._initMenus(), this._initShortcuts();
   }
 };
-qe = ji([
-  nn(tn.Ready, qe),
-  Re(0, Se(Un)),
-  Re(1, Se(Kt)),
-  Re(2, Yt),
-  Re(3, W),
-  Re(4, Zt)
-], qe);
-var ki = Object.defineProperty, $i = Object.getOwnPropertyDescriptor, zi = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? $i(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && ki(e, n, o), o;
-}, de = (i, e) => (n, t) => e(n, t, i);
-let ln = class extends Ue {
-  constructor(i, e, n, t, o, r, a, s, l, c, m, u) {
-    super(), this._context = i, this._commandService = e, this._textSelectionManagerService = n, this._renderManagerSrv = t, this._imageIoService = o, this._docDrawingService = r, this._drawingManagerService = a, this._contextService = s, this._messageService = l, this._localeService = c, this._textSelectionManager = m, this._textSelectionRenderManager = u, this._initCommandListeners(), this._updateDrawingListener(), this._updateOrderListener(), this._groupDrawingListener(), this._focusDrawingListener();
+et = Ki([
+  at(st.Ready, et),
+  He(0, pe(kt)),
+  He(1, pe(ni)),
+  He(2, ii),
+  He(3, $),
+  He(4, ri)
+], et);
+var Yi = Object.defineProperty, Zi = Object.getOwnPropertyDescriptor, Qi = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? Zi(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && Yi(e, t, r), r;
+}, de = (i, e) => (t, n) => e(t, n, i);
+let ut = class extends qe {
+  constructor(i, e, t, n, r, o, a, s, l, c, m, u, f) {
+    super(), this._context = i, this._commandService = e, this._textSelectionManagerService = t, this._renderManagerSrv = n, this._imageIoService = r, this._docDrawingService = o, this._drawingManagerService = a, this._contextService = s, this._messageService = l, this._localeService = c, this._textSelectionManager = m, this._textSelectionRenderManager = u, this._docRefreshDrawingsService = f, this._initCommandListeners(), this._updateDrawingListener(), this._updateOrderListener(), this._groupDrawingListener(), this._focusDrawingListener(), this._editAreaChangeListener();
   }
   /**
    * Upload image to cell or float image
@@ -1495,19 +1416,19 @@ let ln = class extends Ue {
   _initCommandListeners() {
     this.disposeWithMe(
       this._commandService.onCommandExecuted(async (i) => {
-        if (i.id === rn.id) {
+        if (i.id === vt.id) {
           const e = i.params;
           if (e.files == null)
             return;
-          const n = e.files.length;
-          if (n > _n) {
+          const t = e.files.length;
+          if (t > St) {
             this._messageService.show({
-              type: Ve.Error,
-              content: this._localeService.t("update-status.exceedMaxCount", String(_n))
+              type: Nt.Error,
+              content: this._localeService.t("update-status.exceedMaxCount", String(St))
             });
             return;
           }
-          this._imageIoService.setWaitCount(n), await this._insertFloatImages(e.files);
+          this._imageIoService.setWaitCount(t), await this._insertFloatImages(e.files);
         }
       })
     );
@@ -1516,64 +1437,76 @@ let ln = class extends Ue {
   async _insertFloatImages(i) {
     let e = [];
     try {
-      e = await Promise.all(i.map((o) => this._imageIoService.saveImage(o)));
-    } catch (o) {
-      const r = o.message;
-      r === an.ERROR_EXCEED_SIZE ? this._messageService.show({
-        type: Ve.Error,
-        content: this._localeService.t("update-status.exceedMaxSize", String(Tt / (1024 * 1024)))
-      }) : r === an.ERROR_IMAGE_TYPE ? this._messageService.show({
-        type: Ve.Error,
-        content: this._localeService.t("update-status.invalidImageType")
-      }) : r === an.ERROR_IMAGE && this._messageService.show({
-        type: Ve.Error,
-        content: this._localeService.t("update-status.invalidImage")
+      e = await Promise.all(i.map((r) => this._imageIoService.saveImage(r)));
+    } catch (r) {
+      const o = r.message;
+      let a = "";
+      switch (o) {
+        case mt.ERROR_EXCEED_SIZE:
+          a = this._localeService.t("update-status.exceedMaxSize", String(Ln / (1024 * 1024)));
+          break;
+        case mt.ERROR_IMAGE_TYPE:
+          a = this._localeService.t("update-status.invalidImageType");
+          break;
+        case mt.ERROR_IMAGE:
+          a = this._localeService.t("update-status.invalidImage");
+          break;
+      }
+      this._messageService.show({
+        type: Nt.Error,
+        content: a
       });
     }
     if (e.length === 0)
       return;
-    const { unitId: n } = this._context, t = [];
-    for (const o of e) {
-      if (o == null)
+    const { unitId: t } = this._context, n = [];
+    for (const r of e) {
+      if (r == null)
         continue;
-      const { imageId: r, imageSourceType: a, source: s, base64Cache: l } = o, { width: c, height: m, image: u } = await Mt(l || "");
-      this._imageIoService.addImageSourceCache(r, a, u);
-      let p = 1;
-      if (c > Cn || m > Sn) {
-        const w = Cn / c, v = Sn / m;
-        p = Math.min(w, v);
+      const { imageId: o, imageSourceType: a, source: s, base64Cache: l } = r, { width: c, height: m, image: u } = await Un(l || "");
+      this._imageIoService.addImageSourceCache(o, a, u);
+      let f = 1;
+      if (c > Dt || m > Et) {
+        const v = Dt / c, I = Et / m;
+        f = Math.min(v, I);
       }
-      const f = this._getImagePosition(c * p, m * p);
-      if (f == null)
+      const h = this._getImagePosition(c * f, m * f);
+      if (h == null)
         return;
-      const g = {
-        unitId: n,
-        subUnitId: n,
-        drawingId: r,
-        drawingType: un.DRAWING_IMAGE,
+      const p = {
+        unitId: t,
+        subUnitId: t,
+        drawingId: o,
+        drawingType: Bn.DRAWING_IMAGE,
         imageSourceType: a,
         source: s,
-        transform: Tn(f),
-        docTransform: f,
-        behindDoc: Me.FALSE,
+        transform: Kn(h),
+        docTransform: h,
+        behindDoc: oe.FALSE,
         title: "",
         description: "",
-        layoutType: B.INLINE,
-        wrapText: Ae.BOTH_SIDES,
+        layoutType: k.INLINE,
+        // Insert inline drawing by default.
+        wrapText: je.BOTH_SIDES,
         distB: 0,
         distL: 0,
         distR: 0,
         distT: 0
       };
-      t.push(g);
+      this._isInsertInHeaderFooter() && (p.isMultiTransform = oe.TRUE, p.transforms = p.transform ? [p.transform] : null), n.push(p);
     }
-    this._commandService.executeCommand(st.id, {
-      unitId: n,
-      drawings: t
+    this._commandService.executeCommand(gn.id, {
+      unitId: t,
+      drawings: n
     });
   }
+  _isInsertInHeaderFooter() {
+    var n;
+    const { unitId: i } = this._context, e = (n = this._renderManagerSrv.getRenderById(i)) == null ? void 0 : n.with(ae).getViewModel(), t = e == null ? void 0 : e.getEditArea();
+    return t === xe.HEADER || t === xe.FOOTER;
+  }
   _getImagePosition(i, e) {
-    const n = this._textSelectionManagerService.getActiveTextRange(), t = (n == null ? void 0 : n.getAbsolutePosition()) || {
+    const t = this._textSelectionManagerService.getActiveTextRange(), n = (t == null ? void 0 : t.getAbsolutePosition()) || {
       left: 0,
       top: 0
     };
@@ -1583,139 +1516,160 @@ let ln = class extends Ue {
         height: e
       },
       positionH: {
-        relativeFrom: Y.PAGE,
-        posOffset: t.left
+        relativeFrom: ee.PAGE,
+        posOffset: n.left
       },
       positionV: {
-        relativeFrom: G.MARGIN,
-        posOffset: t.top
+        relativeFrom: V.MARGIN,
+        posOffset: n.top
       },
       angle: 0
     };
   }
   _updateOrderListener() {
     this._drawingManagerService.featurePluginOrderUpdate$.subscribe((i) => {
-      const { unitId: e, subUnitId: n, drawingIds: t, arrangeType: o } = i;
-      this._commandService.executeCommand(it.id, {
+      const { unitId: e, subUnitId: t, drawingIds: n, arrangeType: r } = i;
+      this._commandService.executeCommand(ln.id, {
         unitId: e,
-        subUnitId: n,
-        drawingIds: t,
-        arrangeType: o
+        subUnitId: t,
+        drawingIds: n,
+        arrangeType: r
       });
     });
   }
   _updateDrawingListener() {
     this._drawingManagerService.featurePluginUpdate$.subscribe((i) => {
-      if (i.length === 0)
-        return;
-      const e = [];
-      if (i.forEach((n) => {
-        const { unitId: t, subUnitId: o, drawingId: r, transform: a } = n;
-        if (a == null)
-          return;
-        const s = this._docDrawingService.getDrawingByParam({ unitId: t, subUnitId: o, drawingId: r });
-        if (s == null)
-          return;
-        const l = Vt({ ...s.transform, ...a });
-        if (l == null)
-          return;
-        const c = {
-          ...n,
-          transform: { ...a, ...Tn(l) },
-          docTransform: { ...l }
-        };
-        e.push(c);
-      }), e.length > 0) {
-        const n = i[0].unitId;
-        this._commandService.syncExecuteCommand(ot.id, {
-          unitId: n,
-          drawings: e
-        }), this._refreshDocSkeleton();
-      }
     });
   }
-  _refreshDocSkeleton() {
-    var t;
-    const { mainComponent: i, unitId: e } = this._context, n = (t = this._renderManagerSrv.getRenderById(e)) == null ? void 0 : t.with(me).getSkeleton();
-    n == null || n.calculate(), i == null || i.makeDirty();
-  }
   _groupDrawingListener() {
     this._drawingManagerService.featurePluginGroupUpdate$.subscribe((i) => {
-      this._commandService.executeCommand(at.id, i);
+      this._commandService.executeCommand(mn.id, i);
     }), this._drawingManagerService.featurePluginUngroupUpdate$.subscribe((i) => {
-      this._commandService.executeCommand(rt.id, i);
+      this._commandService.executeCommand(dn.id, i);
     });
   }
   _getCurrentSceneAndTransformer() {
     const { scene: i, mainComponent: e } = this._context;
     if (i == null || e == null)
       return;
-    const n = i.getTransformerByCreate(), { docsLeft: t, docsTop: o } = e.getOffsetConfig();
-    return { scene: i, transformer: n, docsLeft: t, docsTop: o };
+    const t = i.getTransformerByCreate(), { docsLeft: n, docsTop: r } = e.getOffsetConfig();
+    return { scene: i, transformer: t, docsLeft: n, docsTop: r };
   }
   _focusDrawingListener() {
     this.disposeWithMe(
       this._drawingManagerService.focus$.subscribe((i) => {
-        var o;
-        const { transformer: e, docsLeft: n, docsTop: t } = (o = this._getCurrentSceneAndTransformer()) != null ? o : {};
-        i == null || i.length === 0 ? (this._contextService.setContextValue(Ze, !1), this._docDrawingService.focusDrawing([]), e && e.resetProps({
-          zeroTop: 0,
-          zeroLeft: 0
-        })) : (this._contextService.setContextValue(Ze, !0), this._docDrawingService.focusDrawing(i), this._textSelectionManager.replaceTextRanges([]), e && e.resetProps({
-          zeroTop: t,
-          zeroLeft: n
-        }));
+        var r;
+        const { transformer: e, docsLeft: t, docsTop: n } = (r = this._getCurrentSceneAndTransformer()) != null ? r : {};
+        if (i == null || i.length === 0)
+          this._contextService.setContextValue(it, !1), this._docDrawingService.focusDrawing([]), e && e.resetProps({
+            zeroTop: 0,
+            zeroLeft: 0
+          });
+        else {
+          this._contextService.setContextValue(it, !0), this._docDrawingService.focusDrawing(i), this._textSelectionManager.getActiveTextRange() && this._textSelectionManager.replaceTextRanges([]);
+          const a = this._textSelectionRenderManager.getSegment(), s = this._findSegmentIdByDrawingId(i[0].drawingId);
+          a !== s && this._textSelectionRenderManager.setSegment(s), e && e.resetProps({
+            zeroTop: n,
+            zeroLeft: t
+          });
+        }
       })
     );
   }
+  _findSegmentIdByDrawingId(i) {
+    var a, s, l;
+    const { unit: e } = this._context, { body: t, headers: n = {}, footers: r = {} } = e.getSnapshot();
+    if (((a = t == null ? void 0 : t.customBlocks) != null ? a : []).some((c) => c.blockId === i))
+      return "";
+    for (const c of Object.keys(n))
+      if ((s = n[c].body.customBlocks) != null && s.some((m) => m.blockId === i))
+        return c;
+    for (const c of Object.keys(r))
+      if ((l = r[c].body.customBlocks) != null && l.some((m) => m.blockId === i))
+        return c;
+    return "";
+  }
+  // Update drawings edit status and opacity. You can not edit header footer images when you are editing body. and vice verse.
+  _updateDrawingsEditStatus() {
+    var s;
+    const { unit: i, scene: e, unitId: t } = this._context, n = (s = this._renderManagerSrv.getRenderById(t)) == null ? void 0 : s.with(ae).getViewModel();
+    if (n == null || i == null)
+      return;
+    const r = i.getSnapshot(), { drawings: o = {} } = r, a = n.getEditArea() === xe.BODY;
+    for (const l of Object.keys(o)) {
+      const c = o[l], m = Fn({ unitId: t, drawingId: c.drawingId, subUnitId: t }), u = e.fuzzyMathObjects(m, !0);
+      if (u.length)
+        for (const f of u)
+          e.detachTransformerFrom(f), f.setOpacity(0.5), (a && c.isMultiTransform !== oe.TRUE || !a && c.isMultiTransform === oe.TRUE) && (e.attachTransformerTo(f), f.setOpacity(1));
+    }
+  }
+  _editAreaChangeListener() {
+    var t;
+    const { unitId: i } = this._context, e = (t = this._renderManagerSrv.getRenderById(i)) == null ? void 0 : t.with(ae).getViewModel();
+    e != null && (this._updateDrawingsEditStatus(), this.disposeWithMe(
+      e.editAreaChange$.subscribe(() => {
+        this._updateDrawingsEditStatus();
+      })
+    ), this._docRefreshDrawingsService.refreshDrawings$.subscribe((n) => {
+      n != null && queueMicrotask(() => {
+        this._updateDrawingsEditStatus();
+      });
+    }), this.disposeWithMe(
+      this._commandService.onCommandExecuted(async (n) => {
+        n.id === Q.id && queueMicrotask(() => {
+          this._updateDrawingsEditStatus();
+        });
+      })
+    ));
+  }
 };
-ln = zi([
-  de(1, W),
-  de(2, Se(cn)),
-  de(3, Q),
-  de(4, yt),
-  de(5, De),
-  de(6, ge),
-  de(7, xn),
-  de(8, Qt),
-  de(9, Se(en)),
-  de(10, Se(cn)),
-  de(11, Le)
-], ln);
-var Xi = Object.defineProperty, qi = Object.getOwnPropertyDescriptor, Ki = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? qi(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && Xi(e, n, o), o;
-}, $e = (i, e) => (n, t) => e(n, t, i);
-let dn = class extends Ue {
-  constructor(e, n, t, o, r) {
+ut = Qi([
+  de(1, $),
+  de(2, pe(gt)),
+  de(3, se),
+  de(4, kn),
+  de(5, Re),
+  de(6, he),
+  de(7, Bt),
+  de(8, oi),
+  de(9, pe(ot)),
+  de(10, pe(gt)),
+  de(11, Ue),
+  de(12, pe(ct))
+], ut);
+var Ji = Object.defineProperty, er = Object.getOwnPropertyDescriptor, tr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? er(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && Ji(e, t, r), r;
+}, We = (i, e) => (t, n) => e(t, n, i);
+let ft = class extends qe {
+  constructor(e, t, n, r, o, a) {
     super();
-    Pe(this, "_liquid", new Ln());
-    this._context = e, this._docSkeletonManagerService = n, this._commandService = t, this._editorService = o, this._drawingManagerService = r, this._initialize(), this._commandExecutedListener();
+    _e(this, "_liquid", new Ht());
+    this._context = e, this._docSkeletonManagerService = t, this._commandService = n, this._editorService = r, this._drawingManagerService = o, this._docRefreshDrawingsService = a, this._initialize(), this._commandExecutedListener();
   }
   _initialize() {
     this._initialRenderRefresh();
   }
   _initialRenderRefresh() {
-    const { mainComponent: e } = this._context;
-    this._docSkeletonManagerService.currentSkeleton$.subscribe((n) => {
-      if (n == null)
-        return;
-      e.changeSkeleton(n), this._refreshDrawing(n);
+    this._docSkeletonManagerService.currentSkeleton$.subscribe((e) => {
+      e != null && this._refreshDrawing(e);
+    }), this._docRefreshDrawingsService.refreshDrawings$.subscribe((e) => {
+      e != null && this._refreshDrawing(e);
     });
   }
   _commandExecutedListener() {
-    const e = [Z.id, kt.id];
+    const e = [Q.id, Zn.id];
     this.disposeWithMe(
-      this._commandService.onCommandExecuted((n) => {
-        if (e.includes(n.id)) {
-          const t = n.params, { unitId: o } = t, { unitId: r, mainComponent: a } = this._context;
-          if (o !== r)
+      this._commandService.onCommandExecuted((t) => {
+        if (e.includes(t.id)) {
+          const n = t.params, { unitId: r } = n, { unitId: o, mainComponent: a } = this._context;
+          if (r !== o)
             return;
           const s = this._docSkeletonManagerService.getSkeleton();
           if (s == null)
             return;
-          if (this._editorService.isEditor(r)) {
+          if (this._editorService.isEditor(o)) {
             a == null || a.makeDirty();
             return;
           }
@@ -1725,88 +1679,127 @@ let dn = class extends Ue {
     );
   }
   _refreshDrawing(e) {
-    var w, v;
-    const n = e == null ? void 0 : e.getSkeletonData(), { mainComponent: t, unitId: o } = this._context, r = t;
-    if (!n)
+    var D, _;
+    const t = e == null ? void 0 : e.getSkeletonData(), { mainComponent: n, unitId: r } = this._context, o = n;
+    if (!t)
       return;
-    const { left: a, top: s, pageLayoutType: l, pageMarginLeft: c, pageMarginTop: m } = r, { pages: u, skeHeaders: p, skeFooters: f } = n, g = [];
+    const { left: a, top: s, pageLayoutType: l, pageMarginLeft: c, pageMarginTop: m } = o, { pages: u, skeHeaders: f, skeFooters: h } = t, p = {};
     this._liquid.reset();
-    for (let I = 0, C = u.length; I < C; I++) {
-      const P = u[I], { headerId: S, footerId: O, pageWidth: R } = P;
-      if (S) {
-        const D = (w = p.get(S)) == null ? void 0 : w.get(R);
-        D && this._calculateDrawingPosition(o, D, a, s, g);
+    for (let C = 0, O = u.length; C < O; C++) {
+      const y = u[C], { headerId: T, footerId: N, pageWidth: R } = y;
+      if (T) {
+        const E = (D = f.get(T)) == null ? void 0 : D.get(R);
+        E && this._calculateDrawingPosition(
+          r,
+          E,
+          a,
+          s,
+          p,
+          E.marginTop,
+          y.marginLeft
+        );
       }
-      if (O) {
-        const D = (v = f.get(O)) == null ? void 0 : v.get(R);
-        D && this._calculateDrawingPosition(o, D, a, s, g);
+      if (N) {
+        const E = (_ = h.get(N)) == null ? void 0 : _.get(R);
+        E && this._calculateDrawingPosition(
+          r,
+          E,
+          a,
+          s,
+          p,
+          y.pageHeight - y.marginBottom + E.marginTop,
+          y.marginLeft
+        );
       }
-      this._calculateDrawingPosition(o, P, a, s, g), this._liquid.translatePage(P, l, c, m);
+      this._calculateDrawingPosition(r, y, a, s, p, y.marginTop, y.marginLeft), this._liquid.translatePage(y, l, c, m);
+    }
+    const w = Object.values(p), v = w.filter((C) => !C.isMultiTransform), I = w.filter((C) => C.isMultiTransform);
+    v.length > 0 && this._drawingManagerService.refreshTransform(v), I.length > 0 && this._handleMultiDrawingsTransform(I);
+  }
+  _handleMultiDrawingsTransform(e) {
+    const { scene: t, unitId: n } = this._context, r = t.getTransformerByCreate();
+    e.forEach((l) => {
+      const c = this._drawingManagerService.getDrawingByParam(l);
+      c != null && (c.transform = l.transform, c.transforms = l.transforms, c.isMultiTransform = l.isMultiTransform);
+    });
+    const a = [...r.getSelectedObjectMap().keys()], s = Object.values(this._drawingManagerService.getDrawingData(n, n)).filter((l) => l.isMultiTransform === oe.TRUE);
+    this._drawingManagerService.removeNotification(s), this._drawingManagerService.addNotification(e);
+    for (const l of a) {
+      const c = t.getObject(l);
+      c && r.setSelectedControl(c);
     }
-    g.length > 0 && this._drawingManagerService.refreshTransform(g);
   }
-  _calculateDrawingPosition(e, n, t, o, r) {
-    const { skeDrawings: a } = n;
-    this._liquid.translatePagePadding(n), a.forEach((s) => {
-      const { aLeft: l, aTop: c, height: m, width: u, angle: p, drawingId: f, drawingOrigin: g } = s, w = g.layoutType === B.WRAP_NONE && g.behindDoc === Me.TRUE;
-      r.push({
+  _calculateDrawingPosition(e, t, n, r, o, a, s) {
+    const { skeDrawings: l } = t;
+    this._liquid.translatePagePadding({
+      marginTop: a,
+      marginLeft: s
+    }), l.forEach((c) => {
+      const { aLeft: m, aTop: u, height: f, width: h, angle: p, drawingId: w, drawingOrigin: v } = c, I = v.layoutType === k.WRAP_NONE && v.behindDoc === oe.TRUE, { isMultiTransform: D = oe.FALSE } = v, _ = {
+        left: m + n + this._liquid.x,
+        top: u + r + this._liquid.y,
+        width: h,
+        height: f,
+        angle: p
+      };
+      o[w] == null ? o[w] = {
         unitId: e,
         subUnitId: e,
-        drawingId: f,
-        behindText: w,
-        transform: {
-          left: l + t + this._liquid.x,
-          top: c + o + this._liquid.y,
-          width: u,
-          height: m,
-          angle: p
-        }
-      });
-    }), this._liquid.restorePagePadding(n);
+        drawingId: w,
+        behindText: I,
+        transform: _,
+        transforms: [_],
+        isMultiTransform: D
+      } : D === oe.TRUE && o[w].transforms.push(_);
+    }), this._liquid.restorePagePadding({
+      marginTop: a,
+      marginLeft: s
+    });
   }
 };
-dn = Ki([
-  $e(1, Se(me)),
-  $e(2, W),
-  $e(3, Jt),
-  $e(4, ge)
-], dn);
-var Yi = Object.defineProperty, Zi = Object.getOwnPropertyDescriptor, Qi = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? Zi(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && Yi(e, n, o), o;
-}, Ne = (i, e) => (n, t) => e(n, t, i);
-function Ji(i) {
-  var t, o, r, a;
-  if (k.isNoop(i) || !Array.isArray(i))
+ft = tr([
+  We(1, pe(ae)),
+  We(2, $),
+  We(3, ai),
+  We(4, he),
+  We(5, pe(ct))
+], ft);
+var nr = Object.defineProperty, ir = Object.getOwnPropertyDescriptor, rr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? ir(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && nr(e, t, r), r;
+}, Ge = (i, e) => (t, n) => e(t, n, i);
+function or(i) {
+  var n, r, o, a;
+  if (X.isNoop(i) || !Array.isArray(i))
     return null;
   const e = i.find((s) => Array.isArray(s) && (s == null ? void 0 : s[0]) === "drawings");
   if (e == null || !Array.isArray(e) || e.length < 3 || typeof e[1] == "string" && typeof e[2] != "object" || Array.isArray(e[1]) && typeof e[1][1] != "object")
     return null;
-  const n = [];
+  const t = [];
   if (Array.isArray(e == null ? void 0 : e[1]))
     for (const s of e)
-      Array.isArray(s) && n.push({
-        type: (t = s == null ? void 0 : s[1]) != null && t.i ? "add" : "remove",
+      Array.isArray(s) && t.push({
+        type: (n = s == null ? void 0 : s[1]) != null && n.i ? "add" : "remove",
         drawingId: s == null ? void 0 : s[0],
-        drawing: (o = s == null ? void 0 : s[1]) == null ? void 0 : o.i
+        drawing: (r = s == null ? void 0 : s[1]) == null ? void 0 : r.i
       });
   else
-    n.push({
-      type: (r = e[2]) != null && r.i ? "add" : "remove",
+    t.push({
+      type: (o = e[2]) != null && o.i ? "add" : "remove",
       drawingId: e[1],
       drawing: (a = e[2]) == null ? void 0 : a.i
     });
-  return n;
+  return t;
 }
-function eo(i) {
+function ar(i) {
   if (!Array.isArray(i) || i.length < 3 || i[0] !== "drawingsOrder")
     return [];
   const e = [];
-  for (let n = 1; n < i.length; n++) {
-    const t = i[n];
-    if (Array.isArray(t) && typeof t[0] == "number" && typeof t[1] == "object")
-      e.push(t[0]);
+  for (let t = 1; t < i.length; t++) {
+    const n = i[t];
+    if (Array.isArray(n) && typeof n[0] == "number" && typeof n[1] == "object")
+      e.push(n[0]);
     else {
       e.length = 0;
       break;
@@ -1814,9 +1807,9 @@ function eo(i) {
   }
   return e;
 }
-let Ke = class extends Ue {
-  constructor(i, e, n, t, o) {
-    super(), this._univerInstanceService = i, this._commandService = e, this._drawingManagerService = n, this._docDrawingService = t, this._renderManagerService = o, this._initialize();
+let tt = class extends qe {
+  constructor(i, e, t, n, r) {
+    super(), this._univerInstanceService = i, this._commandService = e, this._drawingManagerService = t, this._docDrawingService = n, this._renderManagerService = r, this._initialize();
   }
   _initialize() {
     this._commandExecutedListener();
@@ -1824,87 +1817,87 @@ let Ke = class extends Ue {
   _commandExecutedListener() {
     this.disposeWithMe(
       this._commandService.beforeCommandExecuted((i) => {
-        if (i.id !== Z.id)
+        if (i.id !== Q.id)
           return;
-        const e = i.params, { unitId: n, actions: t } = e, o = Ji(t);
-        if (o != null)
-          for (const { type: r, drawingId: a, drawing: s } of o)
-            r === "add" ? this._addDrawings(n, [s]) : this._removeDrawings(n, [a]);
+        const e = i.params, { unitId: t, actions: n } = e, r = or(n);
+        if (r != null)
+          for (const { type: o, drawingId: a, drawing: s } of r)
+            o === "add" ? this._addDrawings(t, [s]) : this._removeDrawings(t, [a]);
       })
     ), this.disposeWithMe(
       this._commandService.onCommandExecuted((i) => {
-        if (i.id !== Z.id)
+        if (i.id !== Q.id)
           return;
-        const e = i.params, { unitId: n, actions: t } = e;
-        eo(t).length > 0 && this._updateDrawingsOrder(n);
+        const e = i.params, { unitId: t, actions: n } = e;
+        ar(n).length > 0 && this._updateDrawingsOrder(t);
       })
     ), this.disposeWithMe(
       this._commandService.onCommandExecuted((i) => {
         var a;
-        if (i.id !== ft.id && i.id !== ht.id)
+        if (i.id !== Dn.id && i.id !== En.id)
           return;
-        const e = (a = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : a.getUnitId(), n = this._drawingManagerService.getFocusDrawings();
-        if (e == null || n.length === 0)
+        const e = (a = this._univerInstanceService.getCurrentUniverDocInstance()) == null ? void 0 : a.getUnitId(), t = this._drawingManagerService.getFocusDrawings();
+        if (e == null || t.length === 0)
           return;
-        const t = this._renderManagerService.getRenderById(e), o = t == null ? void 0 : t.scene;
-        if (o == null)
+        const n = this._renderManagerService.getRenderById(e), r = n == null ? void 0 : n.scene;
+        if (r == null)
           return !1;
-        o.getTransformerByCreate().refreshControls();
+        r.getTransformerByCreate().refreshControls();
       })
     );
   }
   _addDrawings(i, e) {
-    const n = this._drawingManagerService, t = this._docDrawingService, o = this._docDrawingService.getBatchAddOp(e), { subUnitId: r, redo: a, objects: s } = o;
-    n.applyJson1(i, r, a), t.applyJson1(i, r, a), n.addNotification(s), t.addNotification(s);
+    const t = this._drawingManagerService, n = this._docDrawingService, r = this._docDrawingService.getBatchAddOp(e), { subUnitId: o, redo: a, objects: s } = r;
+    t.applyJson1(i, o, a), n.applyJson1(i, o, a), t.addNotification(s), n.addNotification(s);
   }
   _removeDrawings(i, e) {
-    const n = this._drawingManagerService, t = this._docDrawingService, o = this._docDrawingService.getBatchRemoveOp(e.map((l) => ({
+    const t = this._drawingManagerService, n = this._docDrawingService, r = this._docDrawingService.getBatchRemoveOp(e.map((l) => ({
       unitId: i,
       subUnitId: i,
       drawingId: l
-    }))), { subUnitId: r, redo: a, objects: s } = o;
-    n.applyJson1(i, r, a), t.applyJson1(i, r, a), n.removeNotification(s), t.removeNotification(s);
+    }))), { subUnitId: o, redo: a, objects: s } = r;
+    t.applyJson1(i, o, a), n.applyJson1(i, o, a), t.removeNotification(s), n.removeNotification(s);
   }
   _updateDrawingsOrder(i) {
     const e = this._univerInstanceService.getUniverDocInstance(i);
     if (e == null)
       return;
-    const n = e.getSnapshot().drawingsOrder;
-    if (n == null)
+    const t = e.getSnapshot().drawingsOrder;
+    if (t == null)
       return;
-    const t = this._drawingManagerService, o = this._docDrawingService;
-    t.setDrawingOrder(i, i, n), o.setDrawingOrder(i, i, n);
-    const r = {
+    const n = this._drawingManagerService, r = this._docDrawingService;
+    n.setDrawingOrder(i, i, t), r.setDrawingOrder(i, i, t);
+    const o = {
       unitId: i,
       subUnitId: i,
-      drawingIds: n
+      drawingIds: t
     };
-    t.orderNotification(r), o.orderNotification(r);
+    n.orderNotification(o), r.orderNotification(o);
   }
 };
-Ke = Qi([
-  nn(tn.Steady, Ke),
-  Ne(0, X),
-  Ne(1, W),
-  Ne(2, ge),
-  Ne(3, De),
-  Ne(4, Q)
-], Ke);
-var no = Object.defineProperty, to = Object.getOwnPropertyDescriptor, io = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? to(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && no(e, n, o), o;
-}, ze = (i, e) => (n, t) => e(n, t, i);
-const oo = "__InlineDrawingAnchor__";
-let Ye = class extends Ue {
-  constructor(e, n, t, o) {
+tt = rr([
+  at(st.Steady, tt),
+  Ge(0, te),
+  Ge(1, $),
+  Ge(2, he),
+  Ge(3, Re),
+  Ge(4, se)
+], tt);
+var sr = Object.defineProperty, cr = Object.getOwnPropertyDescriptor, lr = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? cr(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && sr(e, t, r), r;
+}, Ve = (i, e) => (t, n) => e(t, n, i);
+const dr = "__InlineDrawingAnchor__";
+let nt = class extends qe {
+  constructor(e, t, n, r, o) {
     super();
-    Pe(this, "_liquid", new Ln());
-    Pe(this, "_listenerOnImageMap", /* @__PURE__ */ new Set());
+    _e(this, "_liquid", new Ht());
+    _e(this, "_listenerOnImageMap", /* @__PURE__ */ new Set());
     // Use to cache the drawings is under transforming or scaling.
-    Pe(this, "_transformerCache", /* @__PURE__ */ new Map());
-    Pe(this, "_anchorShape");
-    this._commandService = e, this._univerInstanceService = n, this._drawingManagerService = t, this._renderManagerService = o, this._init();
+    _e(this, "_transformerCache", /* @__PURE__ */ new Map());
+    _e(this, "_anchorShape");
+    this._commandService = e, this._univerInstanceService = t, this._drawingManagerService = n, this._renderManagerService = r, this._textSelectionRenderManager = o, this._init();
   }
   _init() {
     this._listenDrawingFocus();
@@ -1913,9 +1906,9 @@ let Ye = class extends Ue {
     this.disposeWithMe(
       this._drawingManagerService.add$.subscribe((e) => {
         if (e.length !== 0)
-          for (const n of e) {
-            const { unitId: t } = n;
-            this._listenerOnImageMap.has(t) || (this._listenTransformerChange(t), this._listenerOnImageMap.add(t));
+          for (const t of e) {
+            const { unitId: n } = t;
+            this._listenerOnImageMap.has(n) || (this._listenTransformerChange(n), this._listenerOnImageMap.add(n));
           }
       })
     );
@@ -1923,66 +1916,66 @@ let Ye = class extends Ue {
   // Only handle one drawing transformer change.
   // eslint-disable-next-line max-lines-per-function
   _listenTransformerChange(e) {
-    var o;
-    const n = (o = this._getSceneAndTransformerByDrawingSearch(e)) == null ? void 0 : o.transformer;
-    if (n == null)
+    var r;
+    const t = (r = this._getSceneAndTransformerByDrawingSearch(e)) == null ? void 0 : r.transformer;
+    if (t == null)
       return;
     this.disposeWithMe(
-      Ee(
-        n.changeStart$.subscribe((r) => {
+      ye(
+        t.changeStart$.subscribe((o) => {
           var s;
           this._transformerCache.clear();
-          const { objects: a } = r;
+          const { objects: a } = o;
           for (const l of a.values()) {
-            const { oKey: c, width: m, height: u, left: p, top: f, angle: g } = l, w = this._drawingManagerService.getDrawingOKey(c);
+            const { oKey: c, width: m, height: u, left: f, top: h, angle: p } = l, w = this._drawingManagerService.getDrawingOKey(c);
             if (w == null)
               continue;
             const v = this._univerInstanceService.getUniverDocInstance(w.unitId), I = (s = v == null ? void 0 : v.getSnapshot().drawings) == null ? void 0 : s[w.drawingId];
-            (I == null ? void 0 : I.layoutType) === B.INLINE && l.setOpacity(0.2), I != null && this._transformerCache.set(w.drawingId, {
+            (I == null ? void 0 : I.layoutType) === k.INLINE && l.setOpacity(0.2), I != null && this._transformerCache.set(w.drawingId, {
               drawing: I,
-              top: f,
-              left: p,
+              top: h,
+              left: f,
               width: m,
               height: u,
-              angle: g
+              angle: p
             });
           }
         })
       )
     );
-    const t = In(this._updateMultipleDrawingDocTransform.bind(this), 50);
-    In(this._nonInlineDrawingTransform.bind(this), 50), this.disposeWithMe(
-      Ee(
-        n.changing$.subscribe((r) => {
-          const { objects: a, offsetX: s, offsetY: l } = r;
+    const n = Ct(this._updateMultipleDrawingDocTransform.bind(this), 50);
+    Ct(this._nonInlineDrawingTransform.bind(this), 50), this.disposeWithMe(
+      ye(
+        t.changing$.subscribe((o) => {
+          const { objects: a, offsetX: s, offsetY: l } = o;
           if (a.size > 1)
-            t(a);
+            n(a);
           else if (a.size === 1) {
-            const c = this._transformerCache.values().next().value, m = a.values().next().value, { width: u, height: p, top: f, left: g, angle: w } = m;
-            if (u === c.width && p === c.height && f === c.top && g === c.left && w === c.angle)
+            const c = this._transformerCache.values().next().value, m = a.values().next().value, { width: u, height: f, top: h, left: p, angle: w } = m;
+            if (u === c.width && f === c.height && h === c.top && p === c.left && w === c.angle)
               return;
-            c && (c.drawing.layoutType, B.INLINE), c && c.drawing.layoutType === B.INLINE && s != null && l != null && this._updateInlineDrawingAnchor(c.drawing, s, l);
+            c && (c.drawing.layoutType, k.INLINE), c && c.drawing.layoutType === k.INLINE && s != null && l != null && this._updateInlineDrawingAnchor(c.drawing, s, l);
           }
         })
       )
     ), this.disposeWithMe(
-      Ee(
-        n.changeEnd$.subscribe((r) => {
-          const { objects: a, offsetX: s, offsetY: l } = r;
+      ye(
+        t.changeEnd$.subscribe((o) => {
+          const { objects: a, offsetX: s, offsetY: l } = o;
           for (const c of a.values()) {
             const m = this._drawingManagerService.getDrawingOKey(c.oKey);
             if (m == null)
               continue;
             const u = this._transformerCache.get(m == null ? void 0 : m.drawingId);
-            (u == null ? void 0 : u.drawing.layoutType) === B.INLINE && c.setOpacity(1);
+            (u == null ? void 0 : u.drawing.layoutType) === k.INLINE && c.setOpacity(1);
           }
           if (this._anchorShape && this._anchorShape.hide(), a.size > 1)
             this._updateMultipleDrawingDocTransform(a);
           else if (a.size === 1) {
-            const c = this._transformerCache.values().next().value, m = a.values().next().value, { width: u, height: p, top: f, left: g, angle: w } = m;
-            if (u === c.width && p === c.height && f === c.top && g === c.left && w === c.angle)
+            const c = this._transformerCache.values().next().value, m = a.values().next().value, { width: u, height: f, top: h, left: p, angle: w } = m;
+            if (u === c.width && f === c.height && h === c.top && p === c.left && w === c.angle)
               return;
-            c && c.drawing.layoutType === B.INLINE ? u !== c.width || p !== c.height || w !== c.angle ? this._updateDrawingSize(c, m) : s != null && l != null && this._moveInlineDrawing(c.drawing, s, l) : c && this._nonInlineDrawingTransform(c.drawing, m);
+            c && c.drawing.layoutType === k.INLINE ? u !== c.width || f !== c.height || w !== c.angle ? this._updateDrawingSize(c, m) : s != null && l != null && this._moveInlineDrawing(c.drawing, s, l) : c && this._nonInlineDrawingTransform(c.drawing, m);
           }
           this._transformerCache.clear();
         })
@@ -1993,308 +1986,355 @@ let Ye = class extends Ue {
   _updateMultipleDrawingDocTransform(e) {
     if (e.size < 1)
       return;
-    const n = [];
-    let t, o;
-    for (const r of e.values()) {
-      const { oKey: a, left: s, top: l, angle: c } = r;
-      let { width: m, height: u } = r;
-      const p = this._drawingManagerService.getDrawingOKey(a);
-      if (p == null)
-        continue;
-      t == null && (t = p.unitId), o == null && (o = p.subUnitId);
-      const f = this._transformerCache.get(p.drawingId);
+    const t = [];
+    let n, r;
+    for (const o of e.values()) {
+      const { oKey: a, left: s, top: l, angle: c } = o;
+      let { width: m, height: u } = o;
+      const f = this._drawingManagerService.getDrawingOKey(a);
       if (f == null)
         continue;
-      const { drawing: g, top: w, left: v, width: I, height: C, angle: P } = f, { width: S, height: O } = this._getPageContentSize(g);
-      if (m = Math.min(m, S), u = Math.min(u, O), (I !== m || C !== u) && n.push({
-        drawingId: p.drawingId,
+      n == null && (n = f.unitId), r == null && (r = f.subUnitId);
+      const h = this._transformerCache.get(f.drawingId);
+      if (h == null)
+        continue;
+      const { drawing: p, top: w, left: v, width: I, height: D, angle: _ } = h, { width: C, height: O } = this._getPageContentSize(p);
+      if (m = Math.min(m, C), u = Math.min(u, O), (I !== m || D !== u) && t.push({
+        drawingId: f.drawingId,
         key: "size",
         value: {
           width: m,
           height: u
         }
-      }), P !== c && n.push({
-        drawingId: p.drawingId,
+      }), _ !== c && t.push({
+        drawingId: f.drawingId,
         key: "angle",
         value: c
       }), w !== l || v !== s) {
-        const R = l - w, D = s - v;
-        R !== 0 && n.push({
-          drawingId: p.drawingId,
+        const y = l - w, T = s - v;
+        y !== 0 && t.push({
+          drawingId: f.drawingId,
           key: "positionV",
           value: {
-            relativeFrom: g.docTransform.positionV.relativeFrom,
-            posOffset: g.docTransform.positionV.posOffset + R
+            relativeFrom: p.docTransform.positionV.relativeFrom,
+            posOffset: p.docTransform.positionV.posOffset + y
           }
-        }), D !== 0 && n.push({
-          drawingId: p.drawingId,
+        }), T !== 0 && t.push({
+          drawingId: f.drawingId,
           key: "positionH",
           value: {
-            relativeFrom: g.docTransform.positionH.relativeFrom,
-            posOffset: g.docTransform.positionH.posOffset + D
+            relativeFrom: p.docTransform.positionH.relativeFrom,
+            posOffset: p.docTransform.positionH.posOffset + T
           }
         });
       }
     }
-    n.length > 0 && t && o && this._commandService.executeCommand(xe.id, {
-      unitId: t,
-      subUnitId: o,
-      drawings: n
+    t.length > 0 && n && r && this._commandService.executeCommand(ze.id, {
+      unitId: n,
+      subUnitId: r,
+      drawings: t
     });
   }
   // TODO: @JOCS, Use to draw and update the drawing anchor.
   _updateDrawingAnchor(e) {
     if (this._transformerCache.size !== 1)
       return;
-    const n = this._transformerCache.values().next().value, t = e.values().next().value;
-    this._getDrawingAnchor(n.drawing, t);
+    const t = this._transformerCache.values().next().value, n = e.values().next().value;
+    this._getDrawingAnchor(t.drawing, n);
   }
-  _updateInlineDrawingAnchor(e, n, t) {
-    var r;
+  _updateInlineDrawingAnchor(e, t, n) {
+    var o;
     if (this._transformerCache.size !== 1)
       return;
-    const { contentBoxPointGroup: o } = (r = this._getInlineDrawingAnchor(e, n, t)) != null ? r : {};
-    o != null && this._createOrUpdateInlineAnchor(e.unitId, o);
+    const { contentBoxPointGroup: r } = (o = this._getInlineDrawingAnchor(e, t, n)) != null ? o : {};
+    r != null && this._createOrUpdateInlineAnchor(e.unitId, r);
   }
-  _getInlineDrawingAnchor(e, n, t) {
-    var V;
-    const o = this._renderManagerService.getRenderById(e.unitId), r = o == null ? void 0 : o.with(me).getSkeleton();
-    if (o == null)
+  _getInlineDrawingAnchor(e, t, n) {
+    var z;
+    const r = this._renderManagerService.getRenderById(e.unitId), o = r == null ? void 0 : r.with(ae).getSkeleton();
+    if (r == null)
       return;
-    const { mainComponent: a, scene: s } = o, l = a, c = s.getViewports()[0], {
-      pageLayoutType: m = Dn.VERTICAL,
+    const { mainComponent: a, scene: s } = r, l = a, c = s.getViewports()[0], {
+      pageLayoutType: m = Pt.VERTICAL,
       pageMarginLeft: u,
-      pageMarginTop: p
+      pageMarginTop: f
     } = l.getOffsetConfig();
-    let f = null, g = !1, w = -1;
-    const v = 0.5, I = this._getTransformCoordForDocumentOffset(l, c, n, t);
-    if (I == null)
+    let h = null, p = !1, w = -1, v = "";
+    const I = 0.5, D = this._getTransformCoordForDocumentOffset(l, c, t, n);
+    if (D == null)
       return;
-    const C = r == null ? void 0 : r.findNodeByCoord(I, m, u, p);
-    if (C) {
-      const { node: x, ratioX: L, segmentPage: z } = C;
-      g = L < v, f = x, w = z;
+    const _ = o == null ? void 0 : o.findNodeByCoord(
+      D,
+      m,
+      u,
+      f,
+      {
+        strict: !1,
+        segmentId: this._textSelectionRenderManager.getSegment(),
+        segmentPage: this._textSelectionRenderManager.getSegmentPage()
+      }
+    );
+    if (_) {
+      const { node: U, ratioX: B, segmentPage: b, segmentId: S } = _;
+      p = B < I, h = U, w = b, v = S;
     }
-    if (f == null)
+    if (h == null)
       return;
-    const P = r == null ? void 0 : r.findPositionByGlyph(f, w), S = this._getDocObject();
-    if (P == null || r == null || S == null)
+    const C = o == null ? void 0 : o.findPositionByGlyph(h, w), O = this._getDocObject();
+    if (C == null || o == null || O == null)
       return;
-    const O = {
-      ...P,
-      isBack: g
-    }, R = S.document.getOffsetConfig(), D = new Pn(R, r), { cursorList: b, contentBoxPointGroup: y } = D.getRangePointData(O, O), { startOffset: T } = (V = En(b)) != null ? V : {};
-    if (T != null)
-      return { offset: T, contentBoxPointGroup: y };
+    const y = {
+      ...C,
+      isBack: p
+    }, T = O.document.getOffsetConfig(), N = new Ot(T, o), { cursorList: R, contentBoxPointGroup: E } = N.getRangePointData(y, y), { startOffset: H } = (z = Tt(R)) != null ? z : {};
+    if (H != null)
+      return { offset: H, contentBoxPointGroup: E, segmentId: v, segmentPage: w };
   }
   // eslint-disable-next-line max-lines-per-function, complexity
-  _getDrawingAnchor(e, n) {
-    var ee, we, ve, ne;
-    const t = this._renderManagerService.getRenderById(e.unitId), o = t == null ? void 0 : t.with(me).getSkeleton(), r = o == null ? void 0 : o.getViewModel(), a = o == null ? void 0 : o.getSkeletonData();
-    if (a == null || t == null || r == null)
+  _getDrawingAnchor(e, t) {
+    var we, ve, ne, Ne, Ie, Se, Te, Me, De, J;
+    const n = this._renderManagerService.getRenderById(e.unitId), r = n == null ? void 0 : n.with(ae).getSkeleton(), o = r == null ? void 0 : r.getSkeletonData();
+    if (o == null || n == null)
       return;
-    const { pages: s } = a, { mainComponent: l, scene: c } = t, m = l, u = c.getViewports()[0], { pageLayoutType: p = Dn.VERTICAL, pageMarginLeft: f, pageMarginTop: g, docsLeft: w, docsTop: v } = m.getOffsetConfig(), { left: I, top: C, angle: P } = n;
-    let { width: S, height: O } = n;
-    const { positionV: R, positionH: D } = e.docTransform, { width: b, height: y } = this._getPageContentSize(e);
-    S = Math.min(S, b), O = Math.min(O, y);
-    let T = null, V = -1;
-    const x = !1, L = {
+    const { pages: a, skeHeaders: s, skeFooters: l } = o, { mainComponent: c, scene: m } = n, u = c, f = m.getViewports()[0], { pageLayoutType: h = Pt.VERTICAL, pageMarginLeft: p, pageMarginTop: w, docsLeft: v, docsTop: I } = u.getOffsetConfig(), { left: D, top: _, angle: C } = t;
+    let { width: O, height: y } = t;
+    const { positionV: T, positionH: N } = e.docTransform, { width: R, height: E } = this._getPageContentSize(e);
+    O = Math.min(O, R), y = Math.min(y, E);
+    let H = null, z = "", U = -1;
+    const B = !1, b = {
       ...e.docTransform,
       size: {
-        width: S,
-        height: O
+        width: O,
+        height: y
       },
-      angle: P
-    }, { x: z, y: N } = c.getViewportScrollXY(u), _ = this._getTransformCoordForDocumentOffset(m, u, I - z, C - N);
-    if (_ == null)
+      angle: C
+    }, { x: S, y: A } = m.getViewportScrollXY(f), P = this._getTransformCoordForDocumentOffset(u, f, D - S, _ - A);
+    if (P == null)
       return;
-    const M = o == null ? void 0 : o.findNodeByCoord(_, p, f, g);
-    if (M) {
-      const { node: le, segmentPage: Ge } = M;
-      T = le, V = Ge;
+    const L = r == null ? void 0 : r.findNodeByCoord(P, h, p, w, {
+      strict: !1,
+      segmentId: this._textSelectionRenderManager.getSegment(),
+      segmentPage: this._textSelectionRenderManager.getSegmentPage()
+    });
+    if (L) {
+      const { node: q, segmentPage: lt, segmentId: dt } = L;
+      H = q, U = lt, z = dt;
     }
-    if (T == null)
+    if (H == null)
+      return;
+    const x = (we = H.parent) == null ? void 0 : we.parent, M = x == null ? void 0 : x.parent, W = (ve = M == null ? void 0 : M.lines.find((q) => q.paragraphIndex === (x == null ? void 0 : x.paragraphIndex) && q.paragraphStart)) != null ? ve : M == null ? void 0 : M.lines[0], G = (ne = M == null ? void 0 : M.parent) == null ? void 0 : ne.parent;
+    if (x == null || M == null || W == null || G == null)
       return;
-    const E = (ee = T.parent) == null ? void 0 : ee.parent, A = E == null ? void 0 : E.parent, U = (we = A == null ? void 0 : A.lines.find((le) => le.paragraphIndex === (E == null ? void 0 : E.paragraphIndex) && le.paragraphStart)) != null ? we : A == null ? void 0 : A.lines[0], F = (ve = A == null ? void 0 : A.parent) == null ? void 0 : ve.parent;
     this._liquid.reset();
-    for (const le of s) {
-      if (this._liquid.translatePagePadding(le), le === F)
+    const F = G.type;
+    for (const q of a) {
+      const { headerId: lt, footerId: dt, pageHeight: pn, pageWidth: It, marginLeft: _t, marginBottom: hn } = q, wn = a.indexOf(q);
+      if (U > -1 && wn === U) {
+        switch (F) {
+          case Mt.HEADER: {
+            const Fe = (Ne = s.get(lt)) == null ? void 0 : Ne.get(It);
+            if (Fe)
+              this._liquid.translatePagePadding({
+                marginTop: Fe.marginTop,
+                marginLeft: _t
+              });
+            else
+              throw new Error("header skeleton not found");
+            break;
+          }
+          case Mt.FOOTER: {
+            const Fe = (Ie = l.get(dt)) == null ? void 0 : Ie.get(It);
+            if (Fe)
+              this._liquid.translatePagePadding({
+                marginTop: pn - hn + Fe.marginTop,
+                marginLeft: _t
+              });
+            else
+              throw new Error("footer skeleton not found");
+            break;
+          }
+        }
         break;
-      this._liquid.restorePagePadding(le), this._liquid.translatePage(le, p, f, g);
+      }
+      if (this._liquid.translatePagePadding(q), q === G)
+        break;
+      this._liquid.restorePagePadding(q), this._liquid.translatePage(q, h, p, w);
     }
-    if (E == null || A == null || U == null || F == null)
-      return;
-    switch (R.relativeFrom === G.LINE ? T = E.divides[0].glyphGroup[0] : T = U.divides[0].glyphGroup[0], L.positionH = {
-      relativeFrom: D.relativeFrom,
-      posOffset: I - this._liquid.x - w
-    }, D.relativeFrom) {
-      case Y.MARGIN: {
-        L.positionH.posOffset = I - this._liquid.x - w - F.marginLeft;
+    switch (T.relativeFrom === V.LINE ? H = x.divides[0].glyphGroup[0] : H = (De = (Me = (Te = (Se = W.divides) == null ? void 0 : Se[0]) == null ? void 0 : Te.glyphGroup) == null ? void 0 : Me[0]) != null ? De : H, b.positionH = {
+      relativeFrom: N.relativeFrom,
+      posOffset: D - this._liquid.x - v
+    }, N.relativeFrom) {
+      case ee.MARGIN: {
+        b.positionH.posOffset = D - this._liquid.x - v - G.marginLeft;
         break;
       }
-      case Y.COLUMN: {
-        L.positionH.posOffset = I - this._liquid.x - w - A.left;
+      case ee.COLUMN: {
+        b.positionH.posOffset = D - this._liquid.x - v - M.left;
         break;
       }
     }
-    switch (L.positionV = {
-      relativeFrom: R.relativeFrom,
-      posOffset: C - this._liquid.y - v
-    }, R.relativeFrom) {
-      case G.PAGE: {
-        L.positionV.posOffset = C - this._liquid.y - v - F.marginTop;
+    switch (b.positionV = {
+      relativeFrom: T.relativeFrom,
+      posOffset: _ - this._liquid.y - I
+    }, T.relativeFrom) {
+      case V.PAGE: {
+        b.positionV.posOffset = _ - this._liquid.y - I - G.marginTop;
         break;
       }
-      case G.LINE: {
-        L.positionV.posOffset = C - this._liquid.y - v - E.top;
+      case V.LINE: {
+        b.positionV.posOffset = _ - this._liquid.y - I - x.top;
         break;
       }
-      case G.PARAGRAPH: {
-        L.positionV.posOffset = C - this._liquid.y - v - U.top;
+      case V.PARAGRAPH: {
+        b.positionV.posOffset = _ - this._liquid.y - I - W.top;
         break;
       }
     }
-    if (T == null)
+    if (H == null)
       return;
-    const q = o == null ? void 0 : o.findPositionByGlyph(T, V), J = this._getDocObject();
-    if (q == null || o == null || J == null)
+    const ce = r == null ? void 0 : r.findPositionByGlyph(H, U), fe = this._getDocObject();
+    if (ce == null || r == null || fe == null)
       return;
-    const ue = {
-      ...q,
-      isBack: x
-    }, ce = J.document.getOffsetConfig(), pe = new Pn(ce, o), { cursorList: oe } = pe.getRangePointData(ue, ue), { startOffset: K } = (ne = En(oe)) != null ? ne : {};
-    if (K != null)
-      return { offset: K, docTransform: L };
+    const Oe = {
+      ...ce,
+      isBack: B
+    }, Be = fe.document.getOffsetConfig(), Ce = new Ot(Be, r), { cursorList: K } = Ce.getRangePointData(Oe, Oe), { startOffset: le } = (J = Tt(K)) != null ? J : {};
+    if (le != null)
+      return { offset: le, docTransform: b, segmentId: z, segmentPage: U };
   }
   // Update drawing when use transformer to resize it.
-  _updateDrawingSize(e, n) {
-    const t = [], { drawing: o, width: r, height: a, angle: s } = e, { unitId: l, subUnitId: c } = o;
-    let { width: m, height: u, angle: p } = n;
-    const { width: f, height: g } = this._getPageContentSize(o);
-    m = Math.min(f, m), u = Math.min(g, u), (m !== r || u !== a) && t.push({
-      drawingId: o.drawingId,
+  _updateDrawingSize(e, t) {
+    const n = [], { drawing: r, width: o, height: a, angle: s } = e, { unitId: l, subUnitId: c } = r;
+    let { width: m, height: u, angle: f } = t;
+    const { width: h, height: p } = this._getPageContentSize(r);
+    m = Math.min(h, m), u = Math.min(p, u), (m !== o || u !== a) && n.push({
+      drawingId: r.drawingId,
       key: "size",
       value: {
         width: m,
         height: u
       }
-    }), p !== s && t.push({
-      drawingId: o.drawingId,
+    }), f !== s && n.push({
+      drawingId: r.drawingId,
       key: "angle",
-      value: p
-    }), t.length > 0 && l && c && this._commandService.executeCommand(xe.id, {
+      value: f
+    }), n.length > 0 && l && c && this._commandService.executeCommand(ze.id, {
       unitId: l,
       subUnitId: c,
-      drawings: t
+      drawings: n
     });
   }
   // Update inline drawing when use transformer to move it.
-  _moveInlineDrawing(e, n, t) {
-    const o = this._getInlineDrawingAnchor(e, n, t), { offset: r } = o != null ? o : {};
-    if (r != null)
-      return this._commandService.executeCommand(et.id, {
+  _moveInlineDrawing(e, t, n) {
+    const r = this._getInlineDrawingAnchor(e, t, n), { offset: o, segmentId: a, segmentPage: s } = r != null ? r : {};
+    if (o != null)
+      return this._commandService.executeCommand(an.id, {
         unitId: e.unitId,
         subUnitId: e.unitId,
         drawing: e,
-        offset: r
+        offset: o,
+        segmentId: a,
+        segmentPage: s
       });
   }
   // Limit the drawing to the page area, mainly in the vertical direction,
   // and the upper and lower limits cannot exceed the page margin area.
-  _limitDrawingInPage(e, n) {
-    const t = this._renderManagerService.getRenderById(e.unitId), { left: o, top: r, width: a, height: s, angle: l } = n, c = t == null ? void 0 : t.with(me).getSkeleton(), m = c == null ? void 0 : c.getSkeletonData(), { pages: u } = m != null ? m : {};
-    if (m == null || t == null || u == null)
+  _limitDrawingInPage(e, t) {
+    const n = this._renderManagerService.getRenderById(e.unitId), { left: r, top: o, width: a, height: s, angle: l } = t, c = n == null ? void 0 : n.with(ae).getSkeleton(), m = c == null ? void 0 : c.getSkeletonData(), { pages: u } = m != null ? m : {};
+    if (m == null || n == null || u == null)
       return {
-        left: o,
-        top: r,
+        left: r,
+        top: o,
         width: a,
         height: s,
         angle: l
       };
-    const { mainComponent: p } = t, f = p, { top: g, pageLayoutType: w, pageMarginLeft: v, pageMarginTop: I } = f;
-    let C = r;
+    const { mainComponent: f } = n, h = f, { top: p, pageLayoutType: w, pageMarginLeft: v, pageMarginTop: I } = h;
+    let D = o;
     this._liquid.reset();
-    for (const P of u) {
-      const { marginBottom: S, pageHeight: O } = P, R = u.indexOf(P), D = u[R + 1];
-      if (D == null)
+    for (const _ of u) {
+      const { marginBottom: C, pageHeight: O } = _, y = u.indexOf(_), T = u[y + 1];
+      if (T == null)
         continue;
-      if (_e.hasIntersectionBetweenTwoRanges(
-        r,
-        r + s,
-        this._liquid.y + g + O - S,
-        this._liquid.y + g + O + I + D.marginTop
+      if (Pe.hasIntersectionBetweenTwoRanges(
+        o,
+        o + s,
+        this._liquid.y + p + O - C,
+        this._liquid.y + p + O + I + T.marginTop
       )) {
-        const y = r + s / 2, T = this._liquid.y + g + O + I / 2;
-        y < T ? C = Math.min(r, this._liquid.y + g + O - S - s) : C = Math.max(r, this._liquid.y + g + O + I + D.marginTop);
+        const R = o + s / 2, E = this._liquid.y + p + O + I / 2;
+        R < E ? D = Math.min(o, this._liquid.y + p + O - C - s) : D = Math.max(o, this._liquid.y + p + O + I + T.marginTop);
       }
-      this._liquid.translatePage(P, w, v, I);
+      this._liquid.translatePage(_, w, v, I);
     }
     return {
-      left: o,
-      top: C,
+      left: r,
+      top: D,
       width: a,
       height: s,
       angle: l
     };
   }
-  _nonInlineDrawingTransform(e, n, t = !1) {
-    const o = this._limitDrawingInPage(e, n);
-    if (t && o.top !== n.top)
+  _nonInlineDrawingTransform(e, t, n = !1) {
+    const r = e.isMultiTransform === oe.TRUE ? t : this._limitDrawingInPage(e, t);
+    if (n && r.top !== t.top)
       return;
-    const r = this._getDrawingAnchor(e, o), { offset: a, docTransform: s } = r != null ? r : {};
-    return a == null || s == null ? this._updateMultipleDrawingDocTransform(/* @__PURE__ */ new Map([[e.drawingId, n]])) : this._commandService.executeCommand(nt.id, {
+    const o = this._getDrawingAnchor(e, r), { offset: a, docTransform: s, segmentId: l, segmentPage: c } = o != null ? o : {};
+    return a == null || s == null ? this._updateMultipleDrawingDocTransform(/* @__PURE__ */ new Map([[e.drawingId, t]])) : this._commandService.executeCommand(sn.id, {
       unitId: e.unitId,
       subUnitId: e.unitId,
       drawing: e,
       offset: a,
-      docTransform: s
+      docTransform: s,
+      segmentId: l,
+      segmentPage: c
     });
   }
   _getSceneAndTransformerByDrawingSearch(e) {
     if (e == null)
       return;
-    const n = this._renderManagerService.getRenderById(e), t = n == null ? void 0 : n.scene;
-    if (t == null)
+    const t = this._renderManagerService.getRenderById(e), n = t == null ? void 0 : t.scene;
+    if (n == null)
       return;
-    const o = t.getTransformerByCreate();
-    return { scene: t, transformer: o };
+    const r = n.getTransformerByCreate();
+    return { scene: n, transformer: r };
   }
-  _getTransformCoordForDocumentOffset(e, n, t, o) {
-    const { documentTransform: r } = e.getOffsetConfig(), a = n.transformVector2SceneCoord(xt.FromArray([t, o]));
+  _getTransformCoordForDocumentOffset(e, t, n, r) {
+    const { documentTransform: o } = e.getOffsetConfig(), a = t.transformVector2SceneCoord(Gn.FromArray([n, r]));
     if (a)
-      return r.clone().invert().applyPoint(a);
+      return o.clone().invert().applyPoint(a);
   }
-  _createOrUpdateInlineAnchor(e, n) {
-    const t = this._renderManagerService.getRenderById(e);
-    if (t == null)
+  _createOrUpdateInlineAnchor(e, t) {
+    const n = this._renderManagerService.getRenderById(e);
+    if (n == null)
       return;
-    const { mainComponent: o, scene: r } = t, a = o, {
+    const { mainComponent: r, scene: o } = n, a = r, {
       docsLeft: s,
       docsTop: l
-    } = a.getOffsetConfig(), c = Ut(n), { left: m, top: u, height: p } = c, f = m + s, g = u + l;
+    } = a.getOffsetConfig(), c = Vn(t), { left: m, top: u, height: f } = c, h = m + s, p = u + l;
     if (this._anchorShape) {
-      this._anchorShape.transformByState({ left: f, top: g, height: p }), this._anchorShape.show();
+      this._anchorShape.transformByState({ left: h, top: p, height: f }), this._anchorShape.show();
       return;
     }
-    const w = 6, v = new Lt(oo + _e.generateRandomId(w), {
-      left: f,
-      top: g,
-      height: p,
+    const w = 6, v = new jn(dr + Pe.generateRandomId(w), {
+      left: h,
+      top: p,
+      height: f,
       strokeWidth: 2,
-      stroke: Ft(wt.darkGray, 1),
+      stroke: $n(Pn.darkGray, 1),
       evented: !1
     });
-    this._anchorShape = v, r.addObject(v, Bt);
+    this._anchorShape = v, o.addObject(v, zn);
   }
   _getDocObject() {
-    return $t(this._univerInstanceService, this._renderManagerService);
+    return Qn(this._univerInstanceService, this._renderManagerService);
   }
   _getPageContentSize(e) {
-    const n = this._renderManagerService.getRenderById(e.unitId), t = n == null ? void 0 : n.with(me).getSkeleton(), o = 500, r = 500, a = t == null ? void 0 : t.getSkeletonData();
-    if (a == null || n == null)
+    const t = this._renderManagerService.getRenderById(e.unitId), n = t == null ? void 0 : t.with(ae).getSkeleton(), r = 500, o = 500, a = n == null ? void 0 : n.getSkeletonData();
+    if (a == null || t == null)
       return {
-        width: o,
-        height: r
+        width: r,
+        height: o
       };
     const { pages: s } = a;
     let l = null;
@@ -2306,69 +2346,70 @@ let Ye = class extends Ue {
       }
     }
     if (l) {
-      const { pageWidth: c, pageHeight: m, marginLeft: u, marginBottom: p, marginRight: f, marginTop: g } = l;
+      const { pageWidth: c, pageHeight: m, marginLeft: u, marginBottom: f, marginRight: h, marginTop: p } = l;
       return {
-        width: Math.max(o, c - u - f),
-        height: Math.max(r, m - g - p)
+        width: Math.max(r, c - u - h),
+        height: Math.max(o, m - p - f)
       };
     } else
       return {
-        width: o,
-        height: r
+        width: r,
+        height: o
       };
   }
 };
-Ye = io([
-  nn(tn.Rendered, Ye),
-  ze(0, W),
-  ze(1, X),
-  ze(2, ge),
-  ze(3, Q)
-], Ye);
-var ct = Object.defineProperty, ro = Object.getOwnPropertyDescriptor, ao = (i, e, n) => e in i ? ct(i, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[e] = n, so = (i, e, n, t) => {
-  for (var o = t > 1 ? void 0 : t ? ro(e, n) : e, r = i.length - 1, a; r >= 0; r--)
-    (a = i[r]) && (o = (t ? a(e, n, o) : a(o)) || o);
-  return t && o && ct(e, n, o), o;
-}, An = (i, e) => (n, t) => e(n, t, i), lt = (i, e, n) => ao(i, typeof e != "symbol" ? e + "" : e, n);
-const co = "DOCS_DRAWING_UI_PLUGIN";
-let Qe = class extends vt {
-  constructor(i, e, n) {
-    super(), this._injector = e, this._renderManagerSrv = n;
+nt = lr([
+  at(st.Rendered, nt),
+  Ve(0, $),
+  Ve(1, te),
+  Ve(2, he),
+  Ve(3, se),
+  Ve(4, Ue)
+], nt);
+var un = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, gr = (i, e, t) => e in i ? un(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, ur = (i, e, t, n) => {
+  for (var r = n > 1 ? void 0 : n ? mr(e, t) : e, o = i.length - 1, a; o >= 0; o--)
+    (a = i[o]) && (r = (n ? a(e, t, r) : a(r)) || r);
+  return n && r && un(e, t, r), r;
+}, Ut = (i, e) => (t, n) => e(t, n, i), fn = (i, e, t) => gr(i, typeof e != "symbol" ? e + "" : e, t);
+const fr = "DOCS_DRAWING_UI_PLUGIN";
+let rt = class extends On {
+  constructor(i, e, t) {
+    super(), this._injector = e, this._renderManagerSrv = t;
   }
   onStarting(i) {
     [
-      [qe],
-      [Xe],
-      [Ye],
-      [Ke]
-    ].forEach((n) => i.add(n));
+      [et],
+      [Je],
+      [nt],
+      [tt],
+      [ct]
+    ].forEach((t) => i.add(t));
   }
   onReady() {
     [
-      [ln],
-      [dn]
-    ].forEach((i) => this._renderManagerSrv.registerRenderModule(Ce.UNIVER_DOC, i));
+      [ut],
+      [ft]
+    ].forEach((i) => this._renderManagerSrv.registerRenderModule(be.UNIVER_DOC, i));
   }
 };
-lt(Qe, "type", Ce.UNIVER_DOC);
-lt(Qe, "pluginName", co);
-Qe = so([
-  It(Et, bt, Rt),
-  An(1, Se(Un)),
-  An(2, Q)
-], Qe);
+fn(rt, "type", be.UNIVER_DOC);
+fn(rt, "pluginName", fr);
+rt = ur([
+  Tn(An, Hn, Wn),
+  Ut(1, pe(kt)),
+  Ut(2, se)
+], rt);
 export {
-  Oe as ClearDocDrawingTransformerOperation,
-  tt as DeleteDocDrawingsCommand,
-  kn as EditDocDrawingOperation,
-  at as GroupDocDrawingCommand,
-  st as InsertDocDrawingCommand,
-  rn as InsertDocImageOperation,
-  Fe as MoveDocDrawingsCommand,
-  pn as RemoveDocDrawingCommand,
-  it as SetDocDrawingArrangeCommand,
-  ot as SetDocDrawingCommand,
-  jn as SidebarDocDrawingOperation,
-  rt as UngroupDocDrawingCommand,
-  Qe as UniverDocsDrawingUIPlugin
+  Wi as ClearDocDrawingTransformerOperation,
+  cn as DeleteDocDrawingsCommand,
+  Xt as EditDocDrawingOperation,
+  mn as GroupDocDrawingCommand,
+  gn as InsertDocDrawingCommand,
+  vt as InsertDocImageOperation,
+  Xe as MoveDocDrawingsCommand,
+  wt as RemoveDocDrawingCommand,
+  ln as SetDocDrawingArrangeCommand,
+  qt as SidebarDocDrawingOperation,
+  dn as UngroupDocDrawingCommand,
+  rt as UniverDocsDrawingUIPlugin
 };