@univerjs/docs-drawing-ui 0.6.10-experimental.20250428-63779a3 → 0.6.10-experimental.20250428-8c74c87

package/lib/es/index.js

@@ -11,7 +11,7 @@ import { RichTextEditingMutation as te, DocSelectionManagerService as Tn, DocSke
 import { DocSelectionRenderService as Re, getRichTextEditPath as Ye, getCustomBlockIdsInSelections as Ri, docDrawingPositionToTransform as ct, VIEWPORT_KEY as dt, SetDocZoomRatioOperation as lt, DocPrintInterceptorService as Ni, NodePositionConvertToCursor as Hn, getOneTextSelectionRange as Gn, getAnchorBounding as Ei, TEXT_RANGE_LAYER_INDEX as Ai, getDocObject as xi, DocCanvasPopManagerService as Li, IEditorService as Ui } from "@univerjs/docs-ui";
 import { MessageType as jn, clsx as V, InputNumber as He, Select as Vn, Checkbox as Bi, RadioGroup as $n, Radio as Me, render as Fi, unmount as ki } from "@univerjs/design";
 import { BehaviorSubject as yn, debounceTime as gt, Observable as Wi, map as zn, switchMap as Hi, of as Gi, takeUntil as Xn, filter as qn } from "rxjs";
-import { jsxs as K, jsx as h } from "react/jsx-runtime";
+import { jsxs as K, jsx as f } from "react/jsx-runtime";
 import { forwardRef as mt, useRef as ji, createElement as ut, useState as se, useEffect as Mn, useMemo as Vi } from "react";
 const $i = "docs-drawing-ui.config", Kn = {};
 var pe = function() {
@@ -77,7 +77,7 @@ const bn = {
     const n = i.get($), t = i.get(q), r = i.get(ee), o = t.getCurrentUniverDocInstance();
     if (e == null || o == null)
       return !1;
-    const s = r.getRenderById(e.unitId).with(Re), { drawings: c } = e, d = (b = s.getSegment()) != null ? b : "", a = new On(), l = X.getInstance(), m = (E = (y = o.getSelfOrHeaderFooterModel(d).getBody()) == null ? void 0 : y.customBlocks) != null ? E : [], g = c.map((N) => m.find((_) => _.blockId === N.drawingId)).filter((N) => !!N).sort((N, _) => N.startIndex > _.startIndex ? 1 : -1), p = c[0].unitId, u = new Ht();
+    const s = r.getRenderById(e.unitId).with(Re), { drawings: c } = e, d = (b = s.getSegment()) != null ? b : "", a = new On(), l = X.getInstance(), m = (E = (y = o.getSelfOrHeaderFooterModel(d).getBody()) == null ? void 0 : y.customBlocks) != null ? E : [], g = c.map((N) => m.find((_) => _.blockId === N.drawingId)).filter((N) => !!N).sort((N, _) => N.startIndex > _.startIndex ? 1 : -1), h = c[0].unitId, u = new Ht();
     u.reset();
     const v = g[0].startIndex, w = [
       {
@@ -87,7 +87,7 @@ const bn = {
     ], I = {
       id: te.id,
       params: {
-        unitId: p,
+        unitId: h,
         actions: [],
         textRanges: w
       }
@@ -161,16 +161,16 @@ const bn = {
     const c = s.getUnitId(), { drawings: d } = e, { collapsed: a, startOffset: l, segmentId: m } = o, g = s.getSelfOrHeaderFooterModel(m).getBody();
     if (g == null)
       return !1;
-    const p = new On(), u = X.getInstance(), v = [], w = (E = (y = s.getSnapshot().drawingsOrder) == null ? void 0 : y.length) != null ? E : 0;
+    const h = new On(), u = X.getInstance(), v = [], w = (E = (y = s.getSnapshot().drawingsOrder) == null ? void 0 : y.length) != null ? E : 0;
     let I = 0;
     if (a)
-      l > 0 && p.push({
+      l > 0 && h.push({
         t: Q.RETAIN,
         len: l
       });
     else {
       const _ = Gt.selection.delete([o], g, 0, null, !1);
-      p.push(..._);
+      h.push(..._);
       const L = Ri(g, [o]), G = (B = s.getDrawings()) != null ? B : {}, x = (N = s.getDrawingsOrder()) != null ? N : [], j = L.sort((S, D) => x.indexOf(S) > x.indexOf(D) ? -1 : x.indexOf(S) < x.indexOf(D) ? 1 : 0);
       if (j.length > 0)
         for (const S of j) {
@@ -181,7 +181,7 @@ const bn = {
           v.push(T), v.push(U), I++;
         }
     }
-    p.push({
+    h.push({
       t: Q.INSERT,
       body: {
         dataStream: "\b".repeat(d.length),
@@ -192,7 +192,7 @@ const bn = {
       },
       len: d.length
     });
-    const O = Ye(s, m), C = u.editOp(p.serialize(), O);
+    const O = Ye(s, m), C = u.editOp(h.serialize(), O);
     v.push(C);
     for (const _ of d) {
       const { drawingId: L } = _, G = u.insertOp(["drawings", L], _), x = u.insertOp(["drawingsOrder", w - I], L);
@@ -225,7 +225,7 @@ const bn = {
     const m = [];
     let g = be.deepClone(l);
     g = g.slice(3), g.unshift("drawingsOrder"), m.push(g);
-    const p = {
+    const h = {
       id: te.id,
       params: {
         unitId: r,
@@ -233,7 +233,7 @@ const bn = {
         textRanges: null
       }
     };
-    return p.params.actions = m.reduce((v, w) => X.compose(v, w), null), !!n.syncExecuteCommand(p.id, p.params);
+    return h.params.actions = m.reduce((v, w) => X.compose(v, w), null), !!n.syncExecuteCommand(h.id, h.params);
   }
 }, _t = {
   id: "doc.command.ungroup-doc-image",
@@ -317,8 +317,8 @@ let an = class extends Be {
         const w = Un / a, I = Bn / l;
         g = Math.min(w, I);
       }
-      const p = this._getImagePosition(a * g, l * g);
-      if (p == null)
+      const h = this._getImagePosition(a * g, l * g);
+      if (h == null)
         return;
       const u = {
         unitId: n,
@@ -327,8 +327,8 @@ let an = class extends Be {
         drawingType: Ue.DRAWING_IMAGE,
         imageSourceType: s,
         source: c,
-        transform: ct(p),
-        docTransform: p,
+        transform: ct(h),
+        docTransform: h,
         behindDoc: ae.FALSE,
         title: "",
         description: "",
@@ -526,11 +526,11 @@ const Ji = {
   behindText: W.WRAP_NONE
 };
 function Dt(i, e, n, t, r, o, s) {
-  var p, u;
+  var h, u;
   const c = new On(), d = X.getInstance(), a = [], l = o.getSelfOrHeaderFooterModel(e).getBody(), m = o.getSelfOrHeaderFooterModel(i).getBody();
   if (l == null || m == null)
     return;
-  const g = (u = (p = l.customBlocks) == null ? void 0 : p.find((v) => v.blockId === r)) == null ? void 0 : u.startIndex;
+  const g = (u = (h = l.customBlocks) == null ? void 0 : h.find((v) => v.blockId === r)) == null ? void 0 : u.startIndex;
   if (g != null) {
     if (t = Math.min(m.dataStream.length - 2, t), i === e) {
       if (t < g ? (t > 0 && c.push({
@@ -613,7 +613,7 @@ const Ct = {
     const { drawings: n, wrappingStyle: t, unitId: r } = e, o = i.get($), s = i.get(q), d = i.get(ee).getRenderById(r), a = d == null ? void 0 : d.with(ie).getSkeleton().getSkeletonData(), l = d == null ? void 0 : d.with(ie).getViewModel(), m = d == null ? void 0 : d.scene, g = s.getCurrentUniverDocInstance();
     if (g == null || a == null || m == null || l == null)
       return !1;
-    const p = l.getEditArea(), u = m.getTransformerByCreate(), { pages: v, skeHeaders: w, skeFooters: I } = a, O = X.getInstance(), C = [], { drawings: P = {} } = g.getSnapshot();
+    const h = l.getEditArea(), u = m.getTransformerByCreate(), { pages: v, skeHeaders: w, skeFooters: I } = a, O = X.getInstance(), C = [], { drawings: P = {} } = g.getSnapshot();
     for (const N of n) {
       const { drawingId: _ } = N, L = P[_].layoutType, G = Ji[t];
       if (L !== G) {
@@ -632,7 +632,7 @@ const Ct = {
       let x = null, j = 0, S = 0;
       for (const D of v) {
         const { headerId: R, footerId: T, marginTop: U, marginLeft: F, marginBottom: M, pageWidth: A, pageHeight: z } = D;
-        switch (p) {
+        switch (h) {
           case Ge.HEADER: {
             const k = (E = w.get(R)) == null ? void 0 : E.get(A);
             k != null && k.skeDrawings.has(_) && (x = k.skeDrawings.get(_), j = k.marginTop, S = F);
@@ -698,8 +698,8 @@ const Ct = {
     if (r == null)
       return !1;
     const { drawings: o, dist: s, unitId: c } = e, d = X.getInstance(), a = [], { drawings: l = {} } = r.getSnapshot();
-    for (const p of o) {
-      const { drawingId: u } = p;
+    for (const h of o) {
+      const { drawingId: u } = h;
       for (const [v, w] of Object.entries(s)) {
         const I = l[u][v];
         if (I !== w) {
@@ -716,7 +716,7 @@ const Ct = {
         textRanges: null
       }
     };
-    return m.params.actions = a.reduce((p, u) => X.compose(p, u), null), !!n.syncExecuteCommand(m.id, m.params);
+    return m.params.actions = a.reduce((h, u) => X.compose(h, u), null), !!n.syncExecuteCommand(m.id, m.params);
   }
 }, Pt = {
   id: "doc.command.update-doc-drawing-wrap-text",
@@ -728,8 +728,8 @@ const Ct = {
     if (r == null)
       return !1;
     const { drawings: o, wrapText: s, unitId: c } = e, d = X.getInstance(), a = [], { drawings: l = {} } = r.getSnapshot();
-    for (const p of o) {
-      const { drawingId: u } = p, v = l[u].wrapText;
+    for (const h of o) {
+      const { drawingId: u } = h, v = l[u].wrapText;
       if (v !== s) {
         const w = d.replaceOp(["drawings", u, "wrapText"], v, s);
         a.push(w);
@@ -743,7 +743,7 @@ const Ct = {
         textRanges: null
       }
     };
-    return m.params.actions = a.reduce((p, u) => X.compose(p, u), null), !!n.syncExecuteCommand(m.id, m.params);
+    return m.params.actions = a.reduce((h, u) => X.compose(h, u), null), !!n.syncExecuteCommand(m.id, m.params);
   }
 }, Ze = {
   id: "doc.command.update-drawing-doc-transform",
@@ -757,9 +757,9 @@ const Ct = {
     const c = s.getTransformerByCreate(), d = t.getCurrentUniverDocInstance();
     if (d == null)
       return !1;
-    const { drawings: a, unitId: l } = e, m = X.getInstance(), g = [], { drawings: p = {} } = d.getSnapshot();
+    const { drawings: a, unitId: l } = e, m = X.getInstance(), g = [], { drawings: h = {} } = d.getSnapshot();
     for (const w of a) {
-      const { drawingId: I, key: O, value: C } = w, P = p[I].docTransform[O];
+      const { drawingId: I, key: O, value: C } = w, P = h[I].docTransform[O];
       if (!be.diffValue(P, C)) {
         const b = m.replaceOp(["drawings", I, "docTransform", O], P, C);
         g.push(b);
@@ -791,7 +791,7 @@ const Ct = {
     const d = s.getTransformerByCreate(), a = i.get($), m = i.get(q).getCurrentUniverDocInstance();
     if (m == null)
       return !1;
-    const { drawing: g, unitId: p, offset: u, segmentId: v, segmentPage: w, needRefreshDrawings: I } = e;
+    const { drawing: g, unitId: h, offset: u, segmentId: v, segmentPage: w, needRefreshDrawings: I } = e;
     if (I)
       return r.refreshDrawings(c), d.refreshControls(), !0;
     const O = [], { drawingId: C } = g, P = (N = t.getSegment()) != null ? N : "", b = Dt(
@@ -809,7 +809,7 @@ const Ct = {
     const y = {
       id: te.id,
       params: {
-        unitId: p,
+        unitId: h,
         actions: [],
         textRanges: null
       }
@@ -832,7 +832,7 @@ const Ct = {
     const s = o.getTransformerByCreate(), c = i.get($), a = i.get(q).getCurrentUniverDocInstance();
     if (a == null)
       return !1;
-    const { drawing: l, unitId: m, offset: g, docTransform: p, segmentId: u, segmentPage: v } = e, w = [], { drawingId: I } = l, O = (j = t.getSegment()) != null ? j : "", C = Dt(
+    const { drawing: l, unitId: m, offset: g, docTransform: h, segmentId: u, segmentPage: v } = e, w = [], { drawingId: I } = l, O = (j = t.getSegment()) != null ? j : "", C = Dt(
       u,
       O,
       v,
@@ -845,20 +845,20 @@ const Ct = {
       return !1;
     C.length > 0 && w.push(...C);
     const P = X.getInstance(), { drawings: b = {} } = a.getSnapshot(), y = b[I].docTransform, { positionH: E, positionV: B, size: N, angle: _ } = y;
-    if (!be.diffValue(E, p.positionH)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "positionH"], E, p.positionH);
+    if (!be.diffValue(E, h.positionH)) {
+      const S = P.replaceOp(["drawings", I, "docTransform", "positionH"], E, h.positionH);
       w.push(S);
     }
-    if (!be.diffValue(B, p.positionV)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "positionV"], B, p.positionV);
+    if (!be.diffValue(B, h.positionV)) {
+      const S = P.replaceOp(["drawings", I, "docTransform", "positionV"], B, h.positionV);
       w.push(S);
     }
-    if (!be.diffValue(N, p.size)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "size"], N, p.size);
+    if (!be.diffValue(N, h.size)) {
+      const S = P.replaceOp(["drawings", I, "docTransform", "size"], N, h.size);
       w.push(S);
     }
-    if (!be.diffValue(_, p.angle)) {
-      const S = P.replaceOp(["drawings", I, "docTransform", "angle"], _, p.angle);
+    if (!be.diffValue(_, h.angle)) {
+      const S = P.replaceOp(["drawings", I, "docTransform", "angle"], _, h.angle);
       w.push(S);
     }
     const L = {
@@ -884,7 +884,7 @@ const Ct = {
     const d = c[0].unitId, a = o.getRenderById(d), l = a == null ? void 0 : a.scene;
     if (l == null)
       return !1;
-    const m = l.getTransformerByCreate(), g = r.getUniverDocInstance(d), p = c.map((v) => {
+    const m = l.getTransformerByCreate(), g = r.getUniverDocInstance(d), h = c.map((v) => {
       var y, E, B, N, _;
       const { drawingId: w } = v, I = (y = g == null ? void 0 : g.getSnapshot().drawings) == null ? void 0 : y[w];
       if (I == null || I.layoutType === W.INLINE)
@@ -896,12 +896,12 @@ const Ct = {
         value: s === fe.UP || s === fe.DOWN ? b : P
       };
     }).filter((v) => v != null);
-    if (p.length === 0)
+    if (h.length === 0)
       return !1;
     const u = n.syncExecuteCommand(Ze.id, {
       unitId: d,
       subUnitId: d,
-      drawings: p
+      drawings: h
     });
     return m.refreshControls(), !!u;
   }
@@ -945,7 +945,7 @@ const Ct = {
     const n = i.get(we), t = i.get($);
     return e == null ? !1 : (n.focusDrawing([e]), t.executeCommand(bt.id, { value: "open" }), !0);
   }
-}, nr = "univer-image-common-panel", tr = "univer-image-common-panel-grid", ir = "univer-image-common-panel-border", rr = "univer-image-common-panel-title", or = "univer-image-common-panel-subtitle", sr = "univer-image-common-panel-row", ar = "univer-image-common-panel-column", cr = "univer-image-common-panel-span2", dr = "univer-image-common-panel-input", f = {
+}, nr = "univer-image-common-panel", tr = "univer-image-common-panel-grid", ir = "univer-image-common-panel-border", rr = "univer-image-common-panel-title", or = "univer-image-common-panel-subtitle", sr = "univer-image-common-panel-row", ar = "univer-image-common-panel-column", cr = "univer-image-common-panel-span2", dr = "univer-image-common-panel-input", p = {
   imageCommonPanel: nr,
   imageCommonPanelGrid: tr,
   imageCommonPanelBorder: ir,
@@ -962,7 +962,7 @@ const Ct = {
   const { unitId: d } = c, a = o.getUniverDocInstance(d), l = a == null ? void 0 : a.getSnapshot().documentStyle.documentFlavor, m = r.getRenderById(d), g = m == null ? void 0 : m.scene;
   if (g == null)
     return;
-  const p = g.getTransformerByCreate(), u = [{
+  const h = g.getTransformerByCreate(), u = [{
     label: n.t("image-position.column"),
     value: String(ne.COLUMN)
   }, {
@@ -1014,7 +1014,7 @@ const Ct = {
       }))
     });
     const F = (M = r.getRenderById(d)) == null ? void 0 : M.with(Re);
-    F && F.blur(), p.refreshControls();
+    F && F.blur(), h.refreshControls();
   }
   function L(D) {
     var oe, De, Ce;
@@ -1111,13 +1111,13 @@ const Ct = {
     return () => {
       D.unsubscribe(), R.dispose();
     };
-  }, []), /* @__PURE__ */ K("div", { className: V(f.imageCommonPanelGrid, f.imageCommonPanelBorder), style: { display: B ? "block" : "none" }, children: [
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelTitle), children: /* @__PURE__ */ h("div", { children: n.t("image-position.title") }) }) }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSubtitle), children: /* @__PURE__ */ h("div", { children: n.t("image-position.horizontal") }) }) }),
-    /* @__PURE__ */ K("div", { className: f.imageCommonPanelRow, children: [
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-position.absolutePosition") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+  }, []), /* @__PURE__ */ K("div", { className: V(p.imageCommonPanelGrid, p.imageCommonPanelBorder), style: { display: B ? "block" : "none" }, children: [
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelTitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.title") }) }) }),
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.horizontal") }) }) }),
+    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.absolutePosition") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           He,
           {
             min: Yn,
@@ -1131,13 +1131,13 @@ const Ct = {
                 posOffset: D
               });
             },
-            className: f.imageCommonPanelInput
+            className: p.imageCommonPanelInput
           }
         ) }) })
       ] }) }),
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-position.toTheRightOf") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.toTheRightOf") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           Vn,
           {
             value: String(O.relativeFrom),
@@ -1148,11 +1148,11 @@ const Ct = {
         ) }) })
       ] }) })
     ] }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSubtitle), children: /* @__PURE__ */ h("div", { children: n.t("image-position.vertical") }) }) }),
-    /* @__PURE__ */ K("div", { className: f.imageCommonPanelRow, children: [
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-position.absolutePosition") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.vertical") }) }) }),
+    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.absolutePosition") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           He,
           {
             min: Yn,
@@ -1166,13 +1166,13 @@ const Ct = {
                 posOffset: D
               });
             },
-            className: f.imageCommonPanelInput
+            className: p.imageCommonPanelInput
           }
         ) }) })
       ] }) }),
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-position.bellow") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-position.bellow") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           Vn,
           {
             disabled: w,
@@ -1183,8 +1183,8 @@ const Ct = {
         ) }) })
       ] }) })
     ] }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSubtitle), children: /* @__PURE__ */ h("div", { children: n.t("image-position.options") }) }) }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, style: { marginBottom: "50px" }, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(Bi, { disabled: w, checked: y, onChange: S, children: n.t("image-position.moveObjectWithText") }) }) })
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-position.options") }) }) }),
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, style: { marginBottom: "50px" }, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(Bi, { disabled: w, checked: y, onChange: S, children: n.t("image-position.moveObjectWithText") }) }) })
   ] });
 }, nn = 0, tn = 100, gr = (i) => {
   const e = Ie($), n = Ie(fn), t = Ie(we), r = Ie(ee), o = Ie(q), { drawings: s } = i, c = s[0];
@@ -1193,7 +1193,7 @@ const Ct = {
   const { unitId: d } = c, a = o.getUniverDocInstance(d), l = r.getRenderById(d);
   if ((l == null ? void 0 : l.scene) == null)
     return null;
-  const [g, p] = se(!0), [u, v] = se(!0), [w, I] = se(!0), [O, C] = se(he.INLINE), [P, b] = se(""), [y, E] = se({
+  const [g, h] = se(!0), [u, v] = se(!0), [w, I] = se(!0), [O, C] = se(he.INLINE), [P, b] = se(""), [y, E] = se({
     distT: 0,
     distL: 0,
     distB: 0,
@@ -1278,7 +1278,7 @@ const Ct = {
       distL: T,
       distB: U,
       distR: F
-    }), b(z), p(M !== W.WRAP_SQUARE), M === W.WRAP_NONE || M === W.INLINE ? v(!0) : v(!1), M === W.WRAP_NONE || M === W.INLINE || M === W.WRAP_TOP_AND_BOTTOM ? I(!0) : I(!1), M === W.WRAP_NONE)
+    }), b(z), h(M !== W.WRAP_SQUARE), M === W.WRAP_NONE || M === W.INLINE ? v(!0) : v(!1), M === W.WRAP_NONE || M === W.INLINE || M === W.WRAP_TOP_AND_BOTTOM ? I(!0) : I(!1), M === W.WRAP_NONE)
       A === ae.TRUE ? C(he.BEHIND_TEXT) : C(he.IN_FRONT_OF_TEXT);
     else
       switch (M) {
@@ -1309,27 +1309,27 @@ const Ct = {
     return () => {
       S.unsubscribe(), D.dispose();
     };
-  }, []), /* @__PURE__ */ K("div", { className: V(f.imageCommonPanelGrid, f.imageCommonPanelBorder), style: { display: B ? "block" : "none" }, children: [
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelTitle), children: /* @__PURE__ */ h("div", { children: n.t("image-text-wrap.title") }) }) }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSubtitle), children: /* @__PURE__ */ h("div", { children: n.t("image-text-wrap.wrappingStyle") }) }) }),
-    /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelRow), children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn), children: /* @__PURE__ */ K($n, { value: O, onChange: _, direction: "vertical", children: [
-      /* @__PURE__ */ h(Me, { value: he.INLINE, children: n.t("image-text-wrap.inline") }),
-      /* @__PURE__ */ h(Me, { value: he.WRAP_SQUARE, children: n.t("image-text-wrap.square") }),
-      /* @__PURE__ */ h(Me, { value: he.WRAP_TOP_AND_BOTTOM, children: n.t("image-text-wrap.topAndBottom") }),
-      /* @__PURE__ */ h(Me, { value: he.BEHIND_TEXT, children: n.t("image-text-wrap.behindText") }),
-      /* @__PURE__ */ h(Me, { value: he.IN_FRONT_OF_TEXT, children: n.t("image-text-wrap.inFrontText") })
+  }, []), /* @__PURE__ */ K("div", { className: V(p.imageCommonPanelGrid, p.imageCommonPanelBorder), style: { display: B ? "block" : "none" }, children: [
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelTitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.title") }) }) }),
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.wrappingStyle") }) }) }),
+    /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelRow), children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn), children: /* @__PURE__ */ K($n, { value: O, onChange: _, direction: "vertical", children: [
+      /* @__PURE__ */ f(Me, { value: he.INLINE, children: n.t("image-text-wrap.inline") }),
+      /* @__PURE__ */ f(Me, { value: he.WRAP_SQUARE, children: n.t("image-text-wrap.square") }),
+      /* @__PURE__ */ f(Me, { value: he.WRAP_TOP_AND_BOTTOM, children: n.t("image-text-wrap.topAndBottom") }),
+      /* @__PURE__ */ f(Me, { value: he.BEHIND_TEXT, children: n.t("image-text-wrap.behindText") }),
+      /* @__PURE__ */ f(Me, { value: he.IN_FRONT_OF_TEXT, children: n.t("image-text-wrap.inFrontText") })
     ] }) }) }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSubtitle), children: /* @__PURE__ */ h("div", { children: n.t("image-text-wrap.wrapText") }) }) }),
-    /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelRow), children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn), children: /* @__PURE__ */ K($n, { disabled: g, value: P, onChange: L, direction: "horizontal", children: [
-      /* @__PURE__ */ h(Me, { value: Ke.BOTH_SIDES, children: n.t("image-text-wrap.bothSide") }),
-      /* @__PURE__ */ h(Me, { value: Ke.LEFT, children: n.t("image-text-wrap.leftOnly") }),
-      /* @__PURE__ */ h(Me, { value: Ke.RIGHT, children: n.t("image-text-wrap.rightOnly") })
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.wrapText") }) }) }),
+    /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelRow), children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn), children: /* @__PURE__ */ K($n, { disabled: g, value: P, onChange: L, direction: "horizontal", children: [
+      /* @__PURE__ */ f(Me, { value: Ke.BOTH_SIDES, children: n.t("image-text-wrap.bothSide") }),
+      /* @__PURE__ */ f(Me, { value: Ke.LEFT, children: n.t("image-text-wrap.leftOnly") }),
+      /* @__PURE__ */ f(Me, { value: Ke.RIGHT, children: n.t("image-text-wrap.rightOnly") })
     ] }) }) }),
-    /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSubtitle), children: /* @__PURE__ */ h("div", { children: n.t("image-text-wrap.distanceFromText") }) }) }),
-    /* @__PURE__ */ K("div", { className: f.imageCommonPanelRow, children: [
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-text-wrap.top") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+    /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSubtitle), children: /* @__PURE__ */ f("div", { children: n.t("image-text-wrap.distanceFromText") }) }) }),
+    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.top") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           He,
           {
             min: nn,
@@ -1340,13 +1340,13 @@ const Ct = {
             onChange: (S) => {
               G(S, "distT");
             },
-            className: f.imageCommonPanelInput
+            className: p.imageCommonPanelInput
           }
         ) }) })
       ] }) }),
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-text-wrap.left") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.left") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           He,
           {
             min: nn,
@@ -1357,15 +1357,15 @@ const Ct = {
             onChange: (S) => {
               G(S, "distL");
             },
-            className: f.imageCommonPanelInput
+            className: p.imageCommonPanelInput
           }
         ) }) })
       ] }) })
     ] }),
-    /* @__PURE__ */ K("div", { className: f.imageCommonPanelRow, children: [
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-text-wrap.bottom") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+    /* @__PURE__ */ K("div", { className: p.imageCommonPanelRow, children: [
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.bottom") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           He,
           {
             min: nn,
@@ -1376,13 +1376,13 @@ const Ct = {
             onChange: (S) => {
               G(S, "distB");
             },
-            className: f.imageCommonPanelInput
+            className: p.imageCommonPanelInput
           }
         ) }) })
       ] }) }),
-      /* @__PURE__ */ h("div", { className: V(f.imageCommonPanelColumn, f.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: n.t("image-text-wrap.right") }) }),
-        /* @__PURE__ */ h("div", { className: f.imageCommonPanelRow, children: /* @__PURE__ */ h("div", { className: f.imageCommonPanelColumn, children: /* @__PURE__ */ h(
+      /* @__PURE__ */ f("div", { className: V(p.imageCommonPanelColumn, p.imageCommonPanelSpan2), children: /* @__PURE__ */ K("label", { children: [
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: n.t("image-text-wrap.right") }) }),
+        /* @__PURE__ */ f("div", { className: p.imageCommonPanelRow, children: /* @__PURE__ */ f("div", { className: p.imageCommonPanelColumn, children: /* @__PURE__ */ f(
           He,
           {
             min: nn,
@@ -1393,7 +1393,7 @@ const Ct = {
             onChange: (S) => {
               G(S, "distR");
             },
-            className: f.imageCommonPanelInput
+            className: p.imageCommonPanelInput
           }
         ) }) })
       ] }) })
@@ -1408,10 +1408,10 @@ const Ct = {
     return () => {
       r.unsubscribe();
     };
-  }, []), !!(n != null && n.length) && /* @__PURE__ */ K("div", { className: f.imageCommonPanel, children: [
-    /* @__PURE__ */ h(di, { drawings: n, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }),
-    /* @__PURE__ */ h(gr, { drawings: n }),
-    /* @__PURE__ */ h(lr, { drawings: n })
+  }, []), !!(n != null && n.length) && /* @__PURE__ */ K("div", { className: p.imageCommonPanel, children: [
+    /* @__PURE__ */ f(di, { drawings: n, hasAlign: !1, hasCropper: !1, hasGroup: !1, hasTransform: !1 }),
+    /* @__PURE__ */ f(gr, { drawings: n }),
+    /* @__PURE__ */ f(lr, { drawings: n })
   ] });
 }, Nt = "addition-and-subtraction-single", Et = "doc.menu.image", At = St.id, ur = (i) => {
   const e = i.get(Tn), n = i.get(q);
@@ -1422,8 +1422,8 @@ const Ct = {
       if (o) {
         const { segmentId: c, startOffset: d, endOffset: a } = o, l = n.getCurrentUniverDocInstance(), m = (s = l == null ? void 0 : l.getSelfOrHeaderFooterModel(c).getBody()) == null ? void 0 : s.tables;
         if (m && m.length && m.some((g) => {
-          const { startIndex: p, endIndex: u } = g;
-          return d >= p && d < u || a >= p && a < u;
+          const { startIndex: h, endIndex: u } = g;
+          return d >= h && d < u || a >= h && a < u;
         })) {
           t.next(!0);
           return;
@@ -1702,13 +1702,13 @@ var Mr = Object.getOwnPropertyDescriptor, br = (i, e, n, t) => {
   return r;
 }, We = (i, e) => (n, t) => e(n, t, i);
 function xt(i, e, n = 1, t = 0) {
-  const { top: r, left: o, bottom: s, right: c } = i, d = c - o, a = s - r, l = e.getViewport(dt.VIEW_MAIN), { viewportScrollX: m, viewportScrollY: g } = l, { scaleX: p, scaleY: u } = e.getAncestorScale();
+  const { top: r, left: o, bottom: s, right: c } = i, d = c - o, a = s - r, l = e.getViewport(dt.VIEW_MAIN), { viewportScrollX: m, viewportScrollY: g } = l, { scaleX: h, scaleY: u } = e.getAncestorScale();
   return {
-    startX: (o - m) * p,
+    startX: (o - m) * h,
     startY: (r - g) * u,
-    endX: (o + d - m) * p,
+    endX: (o + d - m) * h,
     endY: (r + a - g) * u,
-    width: d * p,
+    width: d * h,
     height: a * u,
     rotate: t,
     absolute: {
@@ -1771,7 +1771,7 @@ let ln = class extends Be {
       if (!(c == null || c.length === 0))
         for (const d of c) {
           this._addHoverForRect(d);
-          const a = new zt(), l = Sn(d, o.renderUnit), m = new yn(l), g = o.canvas, p = s.data, u = {
+          const a = new zt(), l = Sn(d, o.renderUnit), m = new yn(l), g = o.canvas, h = s.data, u = {
             dispose: a,
             rect: d,
             position$: m,
@@ -1793,7 +1793,7 @@ let ln = class extends Be {
             onWheel: (w) => {
               g.dispatchEvent(new WheelEvent(w.type, w));
             },
-            data: p,
+            data: h,
             unitId: t
           });
           const v = d.onTransformChange$.subscribeEvent(() => {
@@ -1885,11 +1885,11 @@ let ln = class extends Be {
         posOffset: 0
       },
       angle: 0
-    }, p = (I = n.drawingId) != null ? I : Xt(), u = {
+    }, h = (I = n.drawingId) != null ? I : Xt(), u = {
       unitId: t.getUnitId(),
       drawings: [
         {
-          drawingId: p,
+          drawingId: h,
           drawingType: Ue.DRAWING_DOM,
           subUnitId: t.getUnitId(),
           unitId: t.getUnitId(),
@@ -1902,7 +1902,7 @@ let ln = class extends Be {
         }
       ]
     };
-    return this._commandService.syncExecuteCommand(Rn.id, u), p;
+    return this._commandService.syncExecuteCommand(Rn.id, u), h;
   }
 };
 ln = br([
@@ -1914,20 +1914,20 @@ ln = br([
   We(5, $)
 ], ln);
 const Rr = (i) => {
-  const { floatDomInfos: e, scene: n, offset: t } = i, r = Vi(() => e.map((o) => {
-    const { width: s, height: c, left: d, top: a } = o.transform, m = xt(
+  const { floatDomInfos: e, scene: n, offset: t, bound: r } = i, o = r.right - r.left, s = r.bottom - r.top, c = Vi(() => e.map((d) => {
+    const { width: a = 0, height: l = 0, left: m = 0, top: g = 0 } = d.transform, u = xt(
       {
-        left: d != null ? d : 0 - t.x,
-        right: (d != null ? d : 0) + (s != null ? s : 0) - t.x,
-        top: a != null ? a : 0 - t.y,
-        bottom: (a != null ? a : 0) + (c != null ? c : 0) - t.y
+        left: m,
+        right: m + a,
+        top: g,
+        bottom: g + l
       },
       n
-    ), g = {
-      position$: new yn(m),
-      position: m,
-      id: o.drawingId,
-      componentKey: o.componentKey,
+    ), v = {
+      position$: new yn(u),
+      position: u,
+      id: d.drawingId,
+      componentKey: d.componentKey,
       onPointerMove: () => {
       },
       onPointerDown: () => {
@@ -1936,11 +1936,12 @@ const Rr = (i) => {
       },
       onWheel: () => {
       },
-      unitId: o.unitId
+      unitId: d.unitId,
+      data: d.data
     };
-    return [o.drawingId, g];
-  }), [e, n, t]);
-  return /* @__PURE__ */ h("div", { style: { position: "absolute", top: 0, left: 0 }, children: r.map(([o, s]) => /* @__PURE__ */ h(yi, { layer: s, id: o, position: s.position }, o)) });
+    return [d.drawingId, v];
+  }).filter(([d, a]) => !(a.position.endX < 0 || a.position.endY < 0 || a.position.startX > o || a.position.startY > s)), [e, n, t, o, s]);
+  return /* @__PURE__ */ f("div", { style: { position: "absolute", top: 0, left: 0 }, children: c.map(([d, a]) => /* @__PURE__ */ f(yi, { layer: a, id: d, position: a.position }, d)) });
 };
 var Nr = Object.getOwnPropertyDescriptor, Er = (i, e, n, t) => {
   for (var r = t > 1 ? void 0 : t ? Nr(e, n) : e, o = i.length - 1, s; o >= 0; o--)
@@ -1992,14 +1993,15 @@ let gn = class extends Be {
                 return null;
               }).filter(Boolean), c = Mi(Rr, this._injector);
               return Fi(
-                /* @__PURE__ */ h(
+                /* @__PURE__ */ f(
                   c,
                   {
                     unitId: t,
                     floatDomInfos: s,
                     scene: e.scene,
                     skeleton: e.skeleton,
-                    offset: e.offset
+                    offset: e.offset,
+                    bound: e.bound
                   }
                 ),
                 e.root
@@ -2068,7 +2070,7 @@ let mn = class extends Be {
           this._transformerCache.clear();
           const { objects: s } = o;
           for (const d of s.values()) {
-            const { oKey: a, width: l, height: m, left: g, top: p, angle: u } = d, v = this._drawingManagerService.getDrawingOKey(a);
+            const { oKey: a, width: l, height: m, left: g, top: h, angle: u } = d, v = this._drawingManagerService.getDrawingOKey(a);
             if (v == null)
               continue;
             const w = this._univerInstanceService.getUniverDocInstance(v.unitId), I = (c = w == null ? void 0 : w.getSnapshot().drawings) == null ? void 0 : c[v.drawingId];
@@ -2079,7 +2081,7 @@ let mn = class extends Be {
               }
             I != null && this._transformerCache.set(v.drawingId, {
               drawing: I,
-              top: p,
+              top: h,
               left: g,
               width: l,
               height: m,
@@ -2097,8 +2099,8 @@ let mn = class extends Be {
           if (s.size > 1)
             t(s);
           else if (s.size === 1) {
-            const a = this._transformerCache.values().next().value, l = s.values().next().value, { width: m, height: g, top: p, left: u, angle: v } = l;
-            if (a && m === a.width && g === a.height && p === a.top && u === a.left && v === a.angle)
+            const a = this._transformerCache.values().next().value, l = s.values().next().value, { width: m, height: g, top: h, left: u, angle: v } = l;
+            if (a && m === a.width && g === a.height && h === a.top && u === a.left && v === a.angle)
               return;
             a && (a.drawing.layoutType, W.INLINE), a && a.drawing.layoutType === W.INLINE && c != null && d != null && this._updateInlineDrawingAnchor(a.drawing, c, d);
           }
@@ -2123,8 +2125,8 @@ let mn = class extends Be {
           if (this._anchorShape && this._anchorShape.hide(), s.size > 1)
             this._updateMultipleDrawingDocTransform(s);
           else if (s.size === 1) {
-            const a = this._transformerCache.values().next().value, l = s.values().next().value, { width: m, height: g, top: p, left: u, angle: v } = l;
-            if (a && m === a.width && g === a.height && p === a.top && u === a.left && v === a.angle)
+            const a = this._transformerCache.values().next().value, l = s.values().next().value, { width: m, height: g, top: h, left: u, angle: v } = l;
+            if (a && m === a.width && g === a.height && h === a.top && u === a.left && v === a.angle)
               return;
             a && a.drawing.layoutType === W.INLINE ? m !== a.width || g !== a.height || v !== a.angle ? this._updateDrawingSize(a, l) : c != null && d != null && this._moveInlineDrawing(a.drawing, c, d) : a && this._nonInlineDrawingTransform(a.drawing, l);
           }
@@ -2146,10 +2148,10 @@ let mn = class extends Be {
       if (g == null)
         continue;
       t == null && (t = g.unitId), r == null && (r = g.subUnitId);
-      const p = this._transformerCache.get(g.drawingId);
-      if (p == null)
+      const h = this._transformerCache.get(g.drawingId);
+      if (h == null)
         continue;
-      const { drawing: u, top: v, left: w, width: I, height: O, angle: C } = p, { width: P, height: b } = this._getPageContentSize(u);
+      const { drawing: u, top: v, left: w, width: I, height: O, angle: C } = h, { width: P, height: b } = this._getPageContentSize(u);
       if (l = Math.min(l, P), m = Math.min(m, b), (I !== l || O !== m) && n.push({
         drawingId: g.drawingId,
         key: "size",
@@ -2210,7 +2212,7 @@ let mn = class extends Be {
       pageMarginLeft: m,
       pageMarginTop: g
     } = d.getOffsetConfig();
-    let p = null, u = !1, v = -1, w = "";
+    let h = null, u = !1, v = -1, w = "";
     const I = 0.5, O = this._getTransformCoordForDocumentOffset(d, a, n, t);
     if (O == null)
       return;
@@ -2224,11 +2226,11 @@ let mn = class extends Be {
     });
     if (P) {
       const { node: S, ratioX: D, segmentPage: R, segmentId: T } = P;
-      u = D < I, p = S, v = R, w = T;
+      u = D < I, h = S, v = R, w = T;
     }
-    if (p == null)
+    if (h == null)
       return;
-    const b = o == null ? void 0 : o.findPositionByGlyph(p, v), y = this._getDocObject();
+    const b = o == null ? void 0 : o.findPositionByGlyph(h, v), y = this._getDocObject();
     if (b == null || o == null || y == null || Qn(b))
       return;
     const E = {
@@ -2244,7 +2246,7 @@ let mn = class extends Be {
     const t = this._renderManagerService.getRenderById(e.unitId), r = t == null ? void 0 : t.with(ie).getSkeleton(), o = r == null ? void 0 : r.getSkeletonData();
     if (o == null || t == null)
       return;
-    const { pages: s, skeHeaders: c, skeFooters: d } = o, { mainComponent: a, scene: l } = t, m = a, g = l.getViewports()[0], { pageLayoutType: p = kn.VERTICAL, pageMarginLeft: u, pageMarginTop: v, docsLeft: w, docsTop: I } = m.getOffsetConfig(), { left: O, top: C, angle: P } = n;
+    const { pages: s, skeHeaders: c, skeFooters: d } = o, { mainComponent: a, scene: l } = t, m = a, g = l.getViewports()[0], { pageLayoutType: h = kn.VERTICAL, pageMarginLeft: u, pageMarginTop: v, docsLeft: w, docsTop: I } = m.getOffsetConfig(), { left: O, top: C, angle: P } = n;
     let { width: b, height: y } = n;
     const { positionV: E, positionH: B } = e.docTransform, { width: N, height: _ } = this._getPageContentSize(e);
     b = Math.min(b, N), y = Math.min(y, _);
@@ -2262,7 +2264,7 @@ let mn = class extends Be {
     const U = (De = this._renderManagerService.getRenderById(e.unitId)) == null ? void 0 : De.with(Re);
     if (U == null)
       return;
-    const F = r == null ? void 0 : r.findNodeByCoord(T, p, u, v, {
+    const F = r == null ? void 0 : r.findNodeByCoord(T, h, u, v, {
       strict: !1,
       segmentId: U.getSegment(),
       segmentPage: U.getSegmentPage()
@@ -2309,7 +2311,7 @@ let mn = class extends Be {
       }
       if (this._liquid.translatePagePadding(ve), ve === k)
         break;
-      this._liquid.restorePagePadding(ve), this._liquid.translatePage(ve, p, u, v);
+      this._liquid.restorePagePadding(ve), this._liquid.translatePage(ve, h, u, v);
     }
     switch (E.relativeFrom === H.LINE ? L = M.divides[0].glyphGroup[0] : L = (me = (ge = (ye = (Ae = z.divides) == null ? void 0 : Ae[0]) == null ? void 0 : ye.glyphGroup) == null ? void 0 : ge[0]) != null ? me : L, S.positionH = {
       relativeFrom: B.relativeFrom,
@@ -2357,8 +2359,8 @@ let mn = class extends Be {
   _updateDrawingSize(e, n) {
     const t = [], { drawing: r, width: o, height: s, angle: c } = e, { unitId: d, subUnitId: a } = r;
     let { width: l, height: m, angle: g } = n;
-    const { width: p, height: u } = this._getPageContentSize(r);
-    l = Math.min(p, l), m = Math.min(u, m), (l !== o || m !== s) && t.push({
+    const { width: h, height: u } = this._getPageContentSize(r);
+    l = Math.min(h, l), m = Math.min(u, m), (l !== o || m !== s) && t.push({
       drawingId: r.drawingId,
       key: "size",
       value: {
@@ -2400,7 +2402,7 @@ let mn = class extends Be {
         height: c,
         angle: d
       };
-    const { mainComponent: g } = t, p = g, { top: u, pageLayoutType: v, pageMarginLeft: w, pageMarginTop: I } = p;
+    const { mainComponent: g } = t, h = g, { top: u, pageLayoutType: v, pageMarginLeft: w, pageMarginTop: I } = h;
     let O = o;
     this._liquid.reset();
     for (const C of m) {
@@ -2462,13 +2464,13 @@ let mn = class extends Be {
     const { mainComponent: r, scene: o } = t, s = r, {
       docsLeft: c,
       docsTop: d
-    } = s.getOffsetConfig(), a = Ei(n), { left: l, top: m, height: g } = a, p = l + c, u = m + d;
+    } = s.getOffsetConfig(), a = Ei(n), { left: l, top: m, height: g } = a, h = l + c, u = m + d;
     if (this._anchorShape) {
-      this._anchorShape.transformByState({ left: p, top: u, height: g }), this._anchorShape.show();
+      this._anchorShape.transformByState({ left: h, top: u, height: g }), this._anchorShape.show();
       return;
     }
     const v = 6, w = new wi(Lr + be.generateRandomId(v), {
-      left: p,
+      left: h,
       top: u,
       height: g,
       strokeWidth: 2,
@@ -2497,9 +2499,9 @@ let mn = class extends Be {
       }
     }
     if (d) {
-      const { pageWidth: a, pageHeight: l, marginLeft: m, marginBottom: g, marginRight: p, marginTop: u } = d;
+      const { pageWidth: a, pageHeight: l, marginLeft: m, marginBottom: g, marginRight: h, marginTop: u } = d;
       return {
-        width: Math.max(r, a - m - p),
+        width: Math.max(r, a - m - h),
         height: Math.max(o, l - u - g)
       };
     } else
@@ -2570,14 +2572,14 @@ let un = class extends Yt {
           const d = c.oKey, a = this._drawingManagerService.getDrawingOKey(d);
           if (!a || a.drawingType === Ue.DRAWING_DOM)
             return;
-          const { unitId: l, subUnitId: m, drawingId: g, drawingType: p } = a, u = this._canvasPopManagerService.attachPopupToObject(
+          const { unitId: l, subUnitId: m, drawingId: g, drawingType: h } = a, u = this._canvasPopManagerService.attachPopupToObject(
             c,
             {
               componentKey: gi,
               direction: "horizontal",
               offset: [2, 0],
               extraProps: {
-                menuItems: this._getImageMenuItems(l, m, g, p)
+                menuItems: this._getImageMenuItems(l, m, g, h)
               }
             },
             l
@@ -2710,7 +2712,7 @@ let Cn = class extends Be {
     const n = e == null ? void 0 : e.getSkeletonData(), { mainComponent: t, unitId: r } = this._context, o = t;
     if (!n)
       return;
-    const { left: s, top: c, pageLayoutType: d, pageMarginLeft: a, pageMarginTop: l } = o, { pages: m, skeHeaders: g, skeFooters: p } = n, u = {};
+    const { left: s, top: c, pageLayoutType: d, pageMarginLeft: a, pageMarginTop: l } = o, { pages: m, skeHeaders: g, skeFooters: h } = n, u = {};
     this._liquid.reset();
     for (let P = 0, b = m.length; P < b; P++) {
       const y = m[P], { headerId: E, footerId: B, pageWidth: N } = y;
@@ -2727,7 +2729,7 @@ let Cn = class extends Be {
         );
       }
       if (B) {
-        const _ = (C = p.get(B)) == null ? void 0 : C.get(N);
+        const _ = (C = h.get(B)) == null ? void 0 : C.get(N);
         _ && this._calculateDrawingPosition(
           r,
           _,
@@ -2762,10 +2764,10 @@ let Cn = class extends Be {
       marginTop: s,
       marginLeft: c
     }), d.forEach((a) => {
-      const { aLeft: l, aTop: m, height: g, width: p, angle: u, drawingId: v, drawingOrigin: w } = a, I = w.layoutType === W.WRAP_NONE && w.behindDoc === ae.TRUE, { isMultiTransform: O = ae.FALSE } = w, C = {
+      const { aLeft: l, aTop: m, height: g, width: h, angle: u, drawingId: v, drawingOrigin: w } = a, I = w.layoutType === W.WRAP_NONE && w.behindDoc === ae.TRUE, { isMultiTransform: O = ae.FALSE } = w, C = {
         left: l + t + this._liquid.x,
         top: m + r + this._liquid.y,
-        width: p,
+        width: h,
         height: g,
         angle: u
       };