@univerjs/slides 0.1.12 → 0.1.13

package/lib/es/index.js

@@ -1,15 +1,14 @@
-var Re = Object.defineProperty;
-var xe = (a, e, r) => e in a ? Re(a, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : a[e] = r;
-var h = (a, e, r) => (xe(a, typeof e != "symbol" ? e + "" : e, r), r);
-import { Registry as Ce, LocaleService as ne, PageElementType as F, DocumentDataModel as je, getColorStyle as te, ShapeType as fe, SlideDataModel as Me, IContextService as Le, ObjectMatrix as Ne, Styles as ze, Worksheet as Ve, sortRules as Xe, OnLifecycle as Ae, LifecycleStages as Ue, RxDisposable as We, UniverInstanceType as M, debounce as $e, IUniverInstanceService as Pe, Plugin as He } from "@univerjs/core";
-import { Liquid as Ye, DocumentViewModel as Fe, DocumentSkeleton as Be, Documents as Ke, SceneViewer as me, Scene as ie, Viewport as X, EVENT_TYPE as pe, ScrollBar as ue, Rect as Y, Picture as Te, PageLayoutType as ve, RichText as ke, Slide as Oe, SpreadsheetSkeleton as qe, Spreadsheet as Ge, SpreadsheetRowHeader as Ze, SpreadsheetColumnHeader as Je, getColor as we, IRenderManagerService as Qe, IRenderingEngine as et } from "@univerjs/engine-render";
-import { Inject as A, Injector as se } from "@wendellhu/redi";
+var Ee = Object.defineProperty;
+var xe = (s, e, r) => e in s ? Ee(s, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : s[e] = r;
+var u = (s, e, r) => (xe(s, typeof e != "symbol" ? e + "" : e, r), r);
+import { Registry as Ce, LocaleService as ne, PageElementType as F, DocumentDataModel as je, getColorStyle as te, BasicShapes as fe, SlideDataModel as Me, IContextService as Xe, ObjectMatrix as Le, Styles as Ve, Worksheet as ze, sortRules as Ne, OnLifecycle as Ae, LifecycleStages as Ye, RxDisposable as We, UniverInstanceType as X, debounce as Ue, IUniverInstanceService as be, Plugin as $e } from "@univerjs/core";
+import { Liquid as He, DocumentViewModel as Fe, DocumentSkeleton as Be, Documents as Ke, SceneViewer as me, Scene as ie, Viewport as N, EVENT_TYPE as ue, ScrollBar as pe, Rect as H, Image as Te, PageLayoutType as ve, RichText as ke, Slide as Oe, SpreadsheetSkeleton as qe, Spreadsheet as Ge, SpreadsheetRowHeader as Ze, SpreadsheetColumnHeader as Je, getColor as we, IRenderManagerService as Qe, IRenderingEngine as et } from "@univerjs/engine-render";
+import { Inject as A, Injector as ae } from "@wendellhu/redi";
 import { takeUntil as Se } from "rxjs";
-const Yt = {}, tt = {}, Ft = {};
 class B {
   constructor() {
-    h(this, "zIndex", 0);
-    h(this, "viewKey", null);
+    u(this, "zIndex", 0);
+    u(this, "viewKey", null);
   }
   check(e) {
     if (e === this.viewKey)
@@ -18,18 +17,18 @@ class B {
   create(e) {
   }
 }
-const $ = Ce.create();
-var rt = Object.defineProperty, nt = Object.getOwnPropertyDescriptor, it = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? nt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && rt(e, r, t), t;
-}, st = (a, e) => (r, n) => e(r, n, a);
+const U = Ce.create();
+var tt = Object.defineProperty, rt = Object.getOwnPropertyDescriptor, nt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? rt(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && tt(e, r, t), t;
+}, it = (s, e) => (r, n) => e(r, n, s);
 let le = class extends B {
   constructor(e) {
     super();
-    h(this, "zIndex", 5);
-    h(this, "viewKey", F.DOCUMENT);
-    h(this, "_liquid", new Ye());
+    u(this, "zIndex", 5);
+    u(this, "viewKey", F.DOCUMENT);
+    u(this, "_liquid", new He());
     this._localeService = e;
   }
   check(e) {
@@ -42,92 +41,92 @@ let le = class extends B {
     const {
       id: n,
       zIndex: t,
-      left: s = 0,
+      left: a = 0,
       top: i = 0,
       width: o,
       height: c,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      title: y,
-      description: E,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
+      title: D,
+      description: y,
       document: T
     } = e;
     if (T == null)
       return;
-    const P = new je(T), w = new Fe(P), I = Be.create(w, this._localeService), S = new Ke("__DocsRender__", I);
+    const b = new je(T), w = new Fe(b), I = Be.create(w, this._localeService), S = new Ke("__DocsRender__", I);
     I.calculate();
-    const D = new me("__DocsViewer__" + n, {
+    const R = new me("__DocsViewer__" + n, {
       top: i,
-      left: s,
+      left: a,
       width: o,
       height: c,
       zIndex: t,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      isTransformer: !0
-    }), v = new ie("__DocsScene__" + n, D), b = new X("__DocsViewPort_" + n, v, {
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _
+    }), v = new ie("__DocsScene__" + n, R), P = new N("__DocsViewPort_" + n, v, {
       left: 0,
       top: 0,
       bottom: 0,
       right: 0,
+      isRelativeX: !0,
+      isRelativeY: !0,
       isWheelPreventDefaultX: !0
     });
-    v.attachControl(), v.on(pe.wheel, (N, W) => {
-      const O = N;
+    v.attachControl(), v.on(ue.wheel, (j, W) => {
+      const O = j;
       if (O.ctrlKey) {
         const z = Math.abs(O.deltaX);
         let x = z < 40 ? 0.2 : z < 80 ? 0.4 : 0.2;
         x *= O.deltaY > 0 ? -1 : 1, v.scaleX < 1 && (x /= 2), v.scaleX + x > 4 ? v.scale(4, 4) : v.scaleX + x < 0.1 ? v.scale(0.1, 0.1) : (O.deltaY > 0, O.preventDefault());
       } else
-        b.onMouseWheel(O, W);
-    }), new ue(b, {
+        P.onMouseWheel(O, W);
+    }), new pe(P, {
       mainScene: r
     }), v.addObject(S);
     const m = I.getActualSize();
     S.resize(m.actualWidth, m.actualHeight), v.resize(m.actualWidth, m.actualHeight + 200);
-    const R = (k = S.getSkeleton()) == null ? void 0 : k.getPageSize();
-    S.onPageRenderObservable.add((N) => {
-      const { page: W, pageLeft: O, pageTop: z, ctx: x } = N, { width: q, height: G, marginBottom: ae, marginLeft: j, marginRight: Z, marginTop: J } = W;
-      x.save(), x.translate(O - 0.5, z - 0.5), Y.drawWith(x, {
-        width: (R == null ? void 0 : R.width) || q,
-        height: (R == null ? void 0 : R.height) || G,
+    const E = (k = S.getSkeleton()) == null ? void 0 : k.getPageSize();
+    S.onPageRenderObservable.add((j) => {
+      const { page: W, pageLeft: O, pageTop: z, ctx: x } = j, { width: q, height: G, marginBottom: se, marginLeft: M, marginRight: Z, marginTop: J } = W;
+      x.save(), x.translate(O - 0.5, z - 0.5), H.drawWith(x, {
+        width: (E == null ? void 0 : E.width) || q,
+        height: (E == null ? void 0 : E.height) || G,
         strokeWidth: 1,
         stroke: "rgba(198,198,198, 1)",
         fill: "rgba(255,255,255, 1)",
         zIndex: 3
       }), x.restore();
     });
-    const { left: H, top: U } = S, L = I.getSkeletonData();
+    const { left: $, top: Y } = S, L = I.getSkeletonData();
     if (L == null)
       return;
     const { pages: C } = L, V = [], K = /* @__PURE__ */ new Map();
     this._recalculateSizeBySkeleton(S, v, I);
-    for (let N = 0, W = C.length; N < W; N++) {
-      const O = C[N], { skeDrawings: z, marginLeft: x, marginTop: q, pageWidth: G, pageHeight: ae } = O;
-      this._liquid.translatePagePadding(O), z.forEach((j) => {
-        const { aLeft: Z, aTop: J, height: De, width: ye, drawingOrigin: Xt } = j, Ee = new Te(j.objectId, {
-          // url: objectTransform.imageProperties?.contentUrl || '',
-          left: Z + H + this._liquid.x,
-          top: J + U + this._liquid.y,
-          width: ye,
-          height: De,
-          zIndex: 11,
-          isTransformer: !0
+    for (let j = 0, W = C.length; j < W; j++) {
+      const O = C[j], { skeDrawings: z, marginLeft: x, marginTop: q, pageWidth: G, pageHeight: se } = O;
+      this._liquid.translatePagePadding(O), z.forEach((M) => {
+        const { aLeft: Z, aTop: J, height: Re, width: De, drawingOrigin: zt } = M, ye = new Te(M.drawingId, {
+          // url: docTransform.imageProperties?.contentUrl || '',
+          left: Z + $ + this._liquid.x,
+          top: J + Y + this._liquid.y,
+          width: De,
+          height: Re,
+          zIndex: 11
         });
-        K.set(j.objectId, {
+        K.set(M.drawingId, {
           marginLeft: this._liquid.x,
           marginTop: this._liquid.y
-        }), V.push(Ee);
+        }), V.push(ye);
       }), this._liquid.translatePage(
         O,
         S.pageLayoutType,
@@ -135,63 +134,65 @@ let le = class extends B {
         S.pageMarginTop
       );
     }
-    return v.openTransformer(), v.addObjects(V), (_e = v.getTransformer()) == null || _e.onChangingObservable.add((N) => {
-      const { objects: W } = N;
+    return v.addObjects(V), V.forEach((j) => {
+      v.attachTransformerTo(j);
+    }), (_e = v.getTransformer()) == null || _e.onChangingObservable.add((j) => {
+      const { objects: W } = j;
       W.forEach((O) => {
-        const { oKey: z, left: x, top: q, height: G, width: ae } = O, j = K.get(z), Z = (j == null ? void 0 : j.marginLeft) || 0, J = (j == null ? void 0 : j.marginTop) || 0;
+        const { oKey: z, left: x, top: q, height: G, width: se } = O, M = K.get(z), Z = (M == null ? void 0 : M.marginLeft) || 0, J = (M == null ? void 0 : M.marginTop) || 0;
         I == null || I.getViewModel().getDataModel().updateDrawing(z, {
-          left: x - H - Z,
-          top: q - U - J,
+          left: x - $ - Z,
+          top: q - Y - J,
           height: G,
-          width: ae
+          width: se
         });
       }), I == null || I.calculate();
-    }), v.closeTransformer(), this._calculatePagePosition(S, v, b), D;
+    }), this._calculatePagePosition(S, v, P), R;
   }
   _recalculateSizeBySkeleton(e, r, n) {
     var o;
     const t = (o = n.getSkeletonData()) == null ? void 0 : o.pages;
     if (t == null)
       return;
-    let s = 0, i = 0;
+    let a = 0, i = 0;
     for (let c = 0, l = t.length; c < l; c++) {
-      const g = t[c], { pageWidth: p, pageHeight: d } = g;
-      e.pageLayoutType === ve.VERTICAL ? (i += d, i += e.pageMarginTop, c === l - 1 && (i += e.pageMarginTop), s = Math.max(s, p)) : e.pageLayoutType === ve.HORIZONTAL && (s += p, c !== l - 1 && (s += e.pageMarginLeft), i = Math.max(i, d));
+      const f = t[c], { pageWidth: h, pageHeight: g } = f;
+      e.pageLayoutType === ve.VERTICAL ? (i += g, i += e.pageMarginTop, c === l - 1 && (i += e.pageMarginTop), a = Math.max(a, h)) : e.pageLayoutType === ve.HORIZONTAL && (a += h, c !== l - 1 && (a += e.pageMarginLeft), i = Math.max(i, g));
     }
-    e.resize(s, i), r.resize(s, i);
+    e.resize(a, i), r.resize(a, i);
   }
   _calculatePagePosition(e, r, n, t = 1) {
-    const s = r == null ? void 0 : r.getParent(), { width: i, height: o, pageMarginLeft: c, pageMarginTop: l } = e;
-    if (s == null || i === Number.POSITIVE_INFINITY || o === Number.POSITIVE_INFINITY)
+    const a = r == null ? void 0 : r.getParent(), { width: i, height: o, pageMarginLeft: c, pageMarginTop: l } = e;
+    if (a == null || i === Number.POSITIVE_INFINITY || o === Number.POSITIVE_INFINITY)
       return;
-    const { width: g, height: p } = s;
-    let d = 0, u = 0, _ = 0, f = 0, y = Number.POSITIVE_INFINITY;
-    if (g > (i + c * 2) * t ? (d = g / 2 - i * t / 2, d /= t, _ = (g - c * 2) / t, y = 0) : (d = c, _ = i + c * 2, y = (_ - g / t) / 2), p > o ? (u = p / 2 - o / 2, f = (p - l * 2) / t) : (u = l, f = o + l * 2), r.resize(_, f + 200), e.translate(d, u), y !== Number.POSITIVE_INFINITY && n != null) {
-      const E = n.getBarScroll(y, 0).x;
+    const { width: f, height: h } = a;
+    let g = 0, d = 0, p = 0, _ = 0, D = Number.POSITIVE_INFINITY;
+    if (f > (i + c * 2) * t ? (g = f / 2 - i * t / 2, g /= t, p = (f - c * 2) / t, D = 0) : (g = c, p = i + c * 2, D = (p - f / t) / 2), h > o ? (d = h / 2 - o / 2, _ = (h - l * 2) / t) : (d = l, _ = o + l * 2), r.resize(p, _ + 200), e.translate(g, d), D !== Number.POSITIVE_INFINITY && n != null) {
+      const y = n.getBarScroll(D, 0).x;
       n.scrollTo({
-        x: E
+        x: y
       });
     }
     return this;
   }
 };
-le = it([
-  st(0, A(ne))
+le = nt([
+  it(0, A(ne))
 ], le);
 class at {
   constructor() {
-    h(this, "zIndex", 5);
+    u(this, "zIndex", 5);
   }
   create(e) {
     return e.createInstance(le);
   }
 }
-$.add(new at());
-class ct extends B {
+U.add(new at());
+class st extends B {
   constructor() {
     super(...arguments);
-    h(this, "zIndex", 1);
-    h(this, "viewKey", F.IMAGE);
+    u(this, "zIndex", 1);
+    u(this, "viewKey", F.IMAGE);
   }
   check(r) {
     if (r === this.viewKey)
@@ -201,59 +202,58 @@ class ct extends B {
     const {
       id: n,
       zIndex: t,
-      left: s = 0,
+      left: a = 0,
       top: i = 0,
       width: o,
       height: c,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      title: y,
-      description: E,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
+      title: D,
+      description: y,
       image: T = {}
-    } = r, { imageProperties: P, placeholder: w, link: I } = T, S = (P == null ? void 0 : P.contentUrl) || "";
+    } = r, { imageProperties: b, placeholder: w, link: I } = T, S = (b == null ? void 0 : b.contentUrl) || "";
     return new Te(n, {
       url: S,
       top: i,
-      left: s,
+      left: a,
       width: o,
       height: c,
       zIndex: t,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      isTransformer: !0,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
       forceRender: !0
     });
   }
 }
-class ot {
+class ct {
   constructor() {
-    h(this, "zIndex", 4);
+    u(this, "zIndex", 4);
   }
   create(e) {
-    return e.createInstance(ct);
+    return e.createInstance(st);
   }
 }
-$.add(new ot());
-var lt = Object.defineProperty, dt = Object.getOwnPropertyDescriptor, ht = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? dt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && lt(e, r, t), t;
-}, gt = (a, e) => (r, n) => e(r, n, a);
+U.add(new ct());
+var ot = Object.defineProperty, lt = Object.getOwnPropertyDescriptor, dt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? lt(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && ot(e, r, t), t;
+}, ht = (s, e) => (r, n) => e(r, n, s);
 let de = class extends B {
   constructor(e) {
     super();
-    h(this, "zIndex", 2);
-    h(this, "viewKey", F.TEXT);
+    u(this, "zIndex", 2);
+    u(this, "viewKey", F.TEXT);
     this._localeService = e;
   }
   check(e) {
@@ -264,58 +264,57 @@ let de = class extends B {
     const {
       id: n,
       zIndex: t,
-      left: s = 0,
+      left: a = 0,
       top: i = 0,
       width: o,
       height: c,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      title: y,
-      description: E,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
+      title: D,
+      description: y,
       richText: T = {}
-    } = e, { text: P, ff: w, fs: I, it: S, bl: D, ul: v, st: b, ol: m, bg: R, bd: H, cl: U, rich: L } = T;
+    } = e, { text: b, ff: w, fs: I, it: S, bl: R, ul: v, st: P, ol: m, bg: E, bd: $, cl: Y, rich: L } = T;
     let C = {
       top: i,
-      left: s,
+      left: a,
       width: o,
       height: c,
       zIndex: t,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      isTransformer: !0,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
       forceRender: !0
     }, V = !1;
-    if (P != null ? (C = { ...C, text: P, ff: w, fs: I, it: S, bl: D, ul: v, st: b, ol: m, bg: R, bd: H, cl: U }, V = !0) : L != null && (C = { ...C, richText: L }, V = !0), V !== !1)
+    if (b != null ? (C = { ...C, text: b, ff: w, fs: I, it: S, bl: R, ul: v, st: P, ol: m, bg: E, bd: $, cl: Y }, V = !0) : L != null && (C = { ...C, richText: L }, V = !0), V !== !1)
       return new ke(this._localeService, n, C);
   }
 };
-de = ht([
-  gt(0, A(ne))
+de = dt([
+  ht(0, A(ne))
 ], de);
-class pt {
+class gt {
   constructor() {
-    h(this, "zIndex", 0);
+    u(this, "zIndex", 0);
   }
   create(e) {
     return e.createInstance(de);
   }
 }
-$.add(new pt());
+U.add(new gt());
 class ut extends B {
   constructor() {
     super(...arguments);
-    h(this, "zIndex", 2);
-    h(this, "viewKey", F.SHAPE);
+    u(this, "zIndex", 2);
+    u(this, "viewKey", F.SHAPE);
   }
   check(r) {
     if (r === this.viewKey)
@@ -325,87 +324,85 @@ class ut extends B {
     const {
       id: n,
       zIndex: t,
-      left: s = 0,
+      left: a = 0,
       top: i = 0,
       width: o,
       height: c,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      title: y,
-      description: E
-    } = r, { shapeType: T, text: P, shapeProperties: w, placeholder: I, link: S } = r.shape || {}, D = w == null ? "" : te(w.shapeBackgroundFill) || "rgba(255,255,255,1)", v = w == null ? void 0 : w.outline, b = {};
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
+      title: D,
+      description: y
+    } = r, { shapeType: T, text: b, shapeProperties: w, placeholder: I, link: S } = r.shape || {}, R = w == null ? "" : te(w.shapeBackgroundFill) || "rgba(255,255,255,1)", v = w == null ? void 0 : w.outline, P = {};
     if (v) {
-      const { outlineFill: m, weight: R } = v;
-      b.strokeWidth = R, b.stroke = te(m) || "rgba(0,0,0,1)";
+      const { outlineFill: m, weight: E } = v;
+      P.strokeWidth = E, P.stroke = te(m) || "rgba(0,0,0,1)";
     }
-    if (T === fe.RECTANGLE)
-      return new Y(n, {
-        fill: D,
+    if (T === fe.Rect)
+      return new H(n, {
+        fill: R,
         top: i,
-        left: s,
+        left: a,
         width: o,
         height: c,
         zIndex: t,
         angle: l,
-        scaleX: g,
-        scaleY: p,
-        skewX: d,
-        skewY: u,
-        flipX: _,
-        flipY: f,
-        isTransformer: !0,
+        scaleX: f,
+        scaleY: h,
+        skewX: g,
+        skewY: d,
+        flipX: p,
+        flipY: _,
         forceRender: !0,
-        ...b
+        ...P
       });
-    if (T === fe.ROUND_RECTANGLE) {
+    if (T === fe.RoundRect) {
       const m = (w == null ? void 0 : w.radius) || 0;
-      return new Y(n, {
-        fill: D,
+      return new H(n, {
+        fill: R,
         top: i,
-        left: s,
+        left: a,
         width: o,
         height: c,
         zIndex: t,
         angle: l,
-        scaleX: g,
-        scaleY: p,
-        skewX: d,
-        skewY: u,
-        flipX: _,
-        flipY: f,
-        isTransformer: !0,
+        scaleX: f,
+        scaleY: h,
+        skewX: g,
+        skewY: d,
+        flipX: p,
+        flipY: _,
         forceRender: !0,
         radius: m,
-        ...b
+        ...P
       });
     }
   }
 }
-class _t {
+class pt {
   constructor() {
-    h(this, "zIndex", 2);
+    u(this, "zIndex", 2);
   }
   create(e) {
     return e.createInstance(ut);
   }
 }
-$.add(new _t());
-var ft = Object.defineProperty, vt = Object.getOwnPropertyDescriptor, wt = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? vt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && ft(e, r, t), t;
-}, St = (a, e) => (r, n) => e(r, n, a);
+U.add(new pt());
+var _t = Object.defineProperty, ft = Object.getOwnPropertyDescriptor, vt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? ft(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && _t(e, r, t), t;
+}, wt = (s, e) => (r, n) => e(r, n, s);
 let he = class extends B {
   constructor(e) {
     super();
-    h(this, "zIndex", 6);
-    h(this, "viewKey", F.SLIDE);
-    h(this, "_ObjectProvider", null);
+    u(this, "zIndex", 6);
+    u(this, "viewKey", F.SLIDE);
+    u(this, "_ObjectProvider", null);
     this._injector = e;
   }
   check(e) {
@@ -416,70 +413,73 @@ let he = class extends B {
     const {
       id: n,
       zIndex: t,
-      left: s = 0,
+      left: a = 0,
       top: i = 0,
       width: o,
       height: c,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      title: y,
-      description: E,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
+      title: D,
+      description: y,
       slide: T
     } = e;
     if (T == null)
       return;
-    const P = new Me(T), w = new Oe("__SLIDERender__" + n, {
+    const b = new Me(T), w = new Oe("__SLIDERender__" + n, {
       top: i,
-      left: s,
+      left: a,
       width: o,
       height: c,
       zIndex: t,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      isTransformer: !1,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
       forceRender: !0
     });
     w.enableNav(), w.enableSelectedClipElement();
-    const I = P.getPageOrder(), S = P.getPages();
+    const I = b.getPageOrder(), S = b.getPages();
     if (!I || !S)
       return w;
     this._ObjectProvider = new re(this._injector);
-    for (let D = 0, v = I.length; D < v; D++) {
-      const b = S[I[D]], { id: m } = b;
-      w.addPage(this._createScene(m, w, b, r, P));
+    for (let R = 0, v = I.length; R < v; R++) {
+      const P = S[I[R]], { id: m } = P;
+      w.addPage(this._createScene(m, w, P, r, b));
     }
     return w.activeFirstPage(), w;
   }
-  _createScene(e, r, n, t, s) {
-    var u;
+  _createScene(e, r, n, t, a) {
+    var d;
     const { width: i, height: o } = r, c = new ie(e, r, {
       width: i,
       height: o
     });
-    new X(`PageViewer_${e}`, c, {
+    new N(`PageViewer_${e}`, c, {
       left: 0,
       top: 0,
       bottom: 0,
-      right: 0
+      right: 0,
+      isRelativeX: !0,
+      isRelativeY: !0
     }).closeClip();
-    const { pageElements: g, pageBackgroundFill: p } = n, d = (u = this._ObjectProvider) == null ? void 0 : u.convertToRenderObjects(g, t);
-    return c.openTransformer(), this._addBackgroundRect(c, p, s), c.addObjects(d), c;
+    const { pageElements: f, pageBackgroundFill: h } = n, g = (d = this._ObjectProvider) == null ? void 0 : d.convertToRenderObjects(f, t);
+    return this._addBackgroundRect(c, h, a), c.addObjects(g), g == null || g.forEach((p) => {
+      c.attachTransformerTo(p);
+    }), c;
   }
   _addBackgroundRect(e, r, n) {
-    const t = n.getPageSize(), { width: s = 0, height: i = 0 } = t, o = new Y("canvas", {
+    const t = n.getPageSize(), { width: a = 0, height: i = 0 } = t, o = new H("canvas", {
       left: 0,
       top: 0,
-      width: s,
+      width: a,
       height: i,
       strokeWidth: 1,
       stroke: "rgba(198,198,198, 1)",
@@ -490,202 +490,207 @@ let he = class extends B {
     e.addObject(o, 0);
   }
 };
-he = wt([
-  St(0, A(se))
+he = vt([
+  wt(0, A(ae))
 ], he);
-class It {
+class St {
   constructor() {
-    h(this, "zIndex", 6);
+    u(this, "zIndex", 6);
   }
   create(e) {
     return e.createInstance(he);
   }
 }
-$.add(new It());
-var bt = Object.defineProperty, Pt = Object.getOwnPropertyDescriptor, mt = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? Pt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && bt(e, r, t), t;
-}, Ie = (a, e) => (r, n) => e(r, n, a);
+U.add(new St());
+var It = Object.defineProperty, Pt = Object.getOwnPropertyDescriptor, bt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? Pt(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && It(e, r, t), t;
+}, Ie = (s, e) => (r, n) => e(r, n, s);
 let ge = class extends B {
   constructor(e, r) {
     super();
-    h(this, "zIndex", 4);
-    h(this, "viewKey", F.SPREADSHEET);
+    u(this, "zIndex", 4);
+    u(this, "viewKey", F.SPREADSHEET);
     this._localeService = e, this._contextService = r;
   }
   check(e) {
     if (e === this.viewKey)
       return this;
   }
+  // eslint-disable-next-line max-lines-per-function
   convert(e, r) {
     const {
       id: n,
       zIndex: t,
-      left: s = 0,
+      left: a = 0,
       top: i = 0,
       width: o,
       height: c,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      spreadsheet: y
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
+      spreadsheet: D
     } = e;
-    if (y == null)
+    if (D == null)
       return;
-    const { worksheet: E, styles: T } = y, { cellData: P } = E, w = new Ne(P), I = new ze(T), S = new qe(
-      new Ve(n, E, I),
+    const { worksheet: y, styles: T } = D, { cellData: b } = y, w = new Le(b), I = new Ve(T), S = new qe(
+      new ze(n, y, I),
       // FIXME: worksheet in slide doesn't has a Worksheet object
-      E,
+      y,
       w,
       I,
       this._localeService,
       this._contextService
-    ), { rowTotalHeight: D, columnTotalWidth: v, rowHeaderWidth: b, columnHeaderHeight: m } = S, R = v + E.rowHeader.width || 0, H = D + E.columnHeader.height || 0, U = new me("spreadInSlideSceneViewer" + n, {
+    ), { rowTotalHeight: R, columnTotalWidth: v, rowHeaderWidth: P, columnHeaderHeight: m } = S, E = v + y.rowHeader.width || 0, $ = R + y.columnHeader.height || 0, Y = new me("spreadInSlideSceneViewer" + n, {
       top: i,
-      left: s,
+      left: a,
       width: o,
       height: c,
       zIndex: t,
       angle: l,
-      scaleX: g,
-      scaleY: p,
-      skewX: d,
-      skewY: u,
-      flipX: _,
-      flipY: f,
-      isTransformer: !0,
+      scaleX: f,
+      scaleY: h,
+      skewX: g,
+      skewY: d,
+      flipX: p,
+      flipY: _,
       forceRender: !0
-    }), L = new ie("spreadInSlideScene" + n, U, {
-      width: R,
-      height: H
+    }), L = new ie("spreadInSlideScene" + n, Y, {
+      width: E,
+      height: $
     });
-    this._updateViewport(n, b, m, L, r);
-    const C = new Ge("testSheetViewer", S, !1), V = new Ze("spreadInSlideRow", S), K = new Je("spreadInSlideColumn", S), k = new Y("spreadInSlideLeftTop", {
+    this._updateViewport(n, P, m, L, r);
+    const C = new Ge("testSheetViewer", S, !1), V = new Ze("spreadInSlideRow", S), K = new Je("spreadInSlideColumn", S), k = new H("spreadInSlideLeftTop", {
       zIndex: 2,
       left: -1,
       top: -1,
-      width: b,
+      width: P,
       height: m,
       fill: we([248, 249, 250]),
       stroke: we([217, 217, 217]),
       strokeWidth: 1
     });
-    return C.zIndex = 10, L.addObjects([C], 1), L.addObjects([V, K, k], 2), U;
+    return C.zIndex = 10, L.addObjects([C], 1), L.addObjects([V, K, k], 2), Y;
   }
-  _updateViewport(e, r, n, t, s) {
-    if (s == null)
+  // eslint-disable-next-line max-lines-per-function
+  _updateViewport(e, r, n, t, a) {
+    if (a == null)
       return;
-    const i = r * t.scaleX, o = n * t.scaleY, c = new X("spreadInSlideViewMain" + e, t, {
+    const i = r * t.scaleX, o = n * t.scaleY, c = new N("spreadInSlideViewMain" + e, t, {
       left: i,
       top: o,
       bottom: 0,
       right: 0,
+      isRelativeX: !0,
+      isRelativeY: !0,
       isWheelPreventDefaultX: !0
-    }), l = new X("spreadInSlideViewTop" + e, t, {
+    }), l = new N("spreadInSlideViewTop" + e, t, {
       left: i,
       height: o,
       top: 0,
       right: 0,
+      isRelativeX: !0,
       isWheelPreventDefaultX: !0
-    }), g = new X("spreadInSlideViewLeft" + e, t, {
+    }), f = new N("spreadInSlideViewLeft" + e, t, {
       left: 0,
       bottom: 0,
       top: o,
       width: i,
+      isRelativeY: !0,
       isWheelPreventDefaultX: !0
     });
-    new X("spreadInSlideViewLeftTop" + e, t, {
+    new N("spreadInSlideViewLeftTop" + e, t, {
       left: 0,
       top: 0,
       width: i,
       height: o,
       isWheelPreventDefaultX: !0
-    }), c.onScrollAfterObserver.add((p) => {
-      const { scrollX: d, scrollY: u, actualScrollX: _, actualScrollY: f } = p;
+    }), c.onScrollAfterObserver.add((h) => {
+      const { scrollX: g, scrollY: d, actualScrollX: p, actualScrollY: _ } = h;
       l.updateScroll({
-        scrollX: d,
-        actualScrollX: _
-      }), g.updateScroll({
-        scrollY: u,
-        actualScrollY: f
+        scrollX: g,
+        actualScrollX: p
+      }), f.updateScroll({
+        scrollY: d,
+        actualScrollY: _
       });
-    }), t.attachControl(), new ue(c, {
-      mainScene: s
-    }), t.on(pe.wheel, (p, d) => {
-      const u = p;
-      if (u.ctrlKey) {
-        const _ = Math.abs(u.deltaX);
-        let f = _ < 40 ? 0.05 : _ < 80 ? 0.02 : 0.01;
-        f *= u.deltaY > 0 ? -1 : 1, t.scaleX < 1 && (f /= 2), t.scaleX + f > 4 ? t.scale(4, 4) : t.scaleX + f < 0.1 ? t.scale(0.1, 0.1) : (t.scaleBy(f, f), u.preventDefault());
+    }), t.attachControl(), new pe(c, {
+      mainScene: a
+    }), t.on(ue.wheel, (h, g) => {
+      const d = h;
+      if (d.ctrlKey) {
+        const p = Math.abs(d.deltaX);
+        let _ = p < 40 ? 0.05 : p < 80 ? 0.02 : 0.01;
+        _ *= d.deltaY > 0 ? -1 : 1, t.scaleX < 1 && (_ /= 2), t.scaleX + _ > 4 ? t.scale(4, 4) : t.scaleX + _ < 0.1 ? t.scale(0.1, 0.1) : (t.scaleBy(_, _), d.preventDefault());
       } else
-        c.onMouseWheel(u, d);
+        c.onMouseWheel(d, g);
     });
   }
 };
-ge = mt([
+ge = bt([
   Ie(0, A(ne)),
-  Ie(1, Le)
+  Ie(1, Xe)
 ], ge);
-class Tt {
+class mt {
   constructor() {
-    h(this, "zIndex", 4);
+    u(this, "zIndex", 4);
   }
   create(e) {
     return e.createInstance(ge);
   }
 }
-$.add(new Tt());
-var Ot = Object.defineProperty, Dt = Object.getOwnPropertyDescriptor, yt = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? Dt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && Ot(e, r, t), t;
-}, Et = (a, e) => (r, n) => e(r, n, a);
+U.add(new mt());
+var Tt = Object.defineProperty, Ot = Object.getOwnPropertyDescriptor, Rt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? Ot(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && Tt(e, r, t), t;
+}, Dt = (s, e) => (r, n) => e(r, n, s);
 let re = class {
-  constructor(a) {
-    h(this, "_adaptors", []);
-    this._injector = a, this._adaptorLoader();
+  constructor(s) {
+    u(this, "_adaptors", []);
+    this._injector = s, this._adaptorLoader();
   }
-  convertToRenderObjects(a, e) {
-    const r = Object.keys(a), n = [];
+  convertToRenderObjects(s, e) {
+    const r = Object.keys(s), n = [];
     return r.forEach((t) => {
-      const s = a[t], i = this._executor(s, e);
+      const a = s[t], i = this._executor(a, e);
       i != null && n.push(i);
     }), n;
   }
-  _executor(a, e) {
+  _executor(s, e) {
     var t;
-    const { id: r, type: n } = a;
-    for (const s of this._adaptors) {
-      const i = (t = s.check(n)) == null ? void 0 : t.convert(a, e);
+    const { id: r, type: n } = s;
+    for (const a of this._adaptors) {
+      const i = (t = a.check(n)) == null ? void 0 : t.convert(s, e);
       if (i != null)
         return i;
     }
   }
   _adaptorLoader() {
-    $.getData().sort(Xe).forEach((a) => {
-      this._adaptors.push(a.create(this._injector));
+    U.getData().sort(Ne).forEach((s) => {
+      this._adaptors.push(s.create(this._injector));
     });
   }
 };
-re = yt([
-  Et(0, A(se))
+re = Rt([
+  Dt(0, A(ae))
 ], re);
-var Rt = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, Ct = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? xt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && Rt(e, r, t), t;
-}, ce = (a, e) => (r, n) => e(r, n, a), jt = /* @__PURE__ */ ((a) => (a.COMPONENT = "__slideRender__", a.SCENE = "__mainScene__", a.VIEW = "__mainView__", a))(jt || {});
+var yt = Object.defineProperty, Et = Object.getOwnPropertyDescriptor, xt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? Et(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && yt(e, r, t), t;
+}, ce = (s, e) => (r, n) => e(r, n, s), Ct = /* @__PURE__ */ ((s) => (s.COMPONENT = "__slideRender__", s.SCENE = "__mainScene__", s.VIEW = "__mainView__", s))(Ct || {});
 let ee = class extends We {
   constructor(e, r, n) {
     super();
-    h(this, "_objectProvider", null);
-    h(this, "_activePageId", "");
-    h(this, "_refreshThumb", $e(() => {
+    u(this, "_objectProvider", null);
+    u(this, "_activePageId", "");
+    u(this, "_refreshThumb", Ue(() => {
       this.createThumbs();
     }, 300));
     this._univerInstanceService = e, this._injector = r, this._renderManagerService = n, this._initializeDependencies(this._injector), this._initialize();
@@ -693,14 +698,14 @@ let ee = class extends We {
   _initialize() {
     this._renderManagerService.createRender$.pipe(Se(this.dispose$)).subscribe((e) => {
       this._create(e);
-    }), this._univerInstanceService.getCurrentTypeOfUnit$(M.UNIVER_SLIDE).pipe(Se(this.dispose$)).subscribe((e) => {
+    }), this._univerInstanceService.getCurrentTypeOfUnit$(X.UNIVER_SLIDE).pipe(Se(this.dispose$)).subscribe((e) => {
       this._create(e == null ? void 0 : e.getUnitId());
-    }), this._univerInstanceService.getAllUnitsForType(M.UNIVER_SLIDE).forEach((e) => {
+    }), this._univerInstanceService.getAllUnitsForType(X.UNIVER_SLIDE).forEach((e) => {
       this._create(e.getUnitId());
     });
   }
   activePage(e) {
-    const r = this._univerInstanceService.getCurrentUnitForType(M.UNIVER_SLIDE);
+    const r = this._univerInstanceService.getCurrentUnitForType(X.UNIVER_SLIDE);
     let n;
     if (e)
       n = r.getPage(e);
@@ -713,74 +718,77 @@ let ee = class extends We {
     const t = this._currentRender();
     if (n == null || t == null || t.mainComponent == null)
       return;
-    const { id: s } = n, i = t.mainComponent;
-    if (this._activePageId = e, i != null && i.hasPage(s)) {
-      i.changePage(s);
+    const { id: a } = n, i = t.mainComponent;
+    if (this._activePageId = e, i != null && i.hasPage(a)) {
+      i.changePage(a);
       return;
     }
-    this._createScene(s, n);
+    this._createScene(a, n);
   }
   _scrollToCenter() {
     var c;
     const e = (c = this._currentRender()) == null ? void 0 : c.scene, r = e == null ? void 0 : e.getViewport("__mainView__"), n = this._getCenterPositionViewPort(e);
     if (!r || !n)
       return;
-    const { left: t, top: s } = n, { x: i, y: o } = r.getBarScroll(t, s);
+    const { left: t, top: a } = n, { x: i, y: o } = r.getBarScroll(t, a);
     r.scrollTo({
       x: i,
       y: o
     });
   }
   _create(e) {
-    e == null || this._univerInstanceService.getUnit(e, M.UNIVER_SLIDE) == null || this._renderManagerService.has(e) || this._addNewRender(e);
+    e == null || this._univerInstanceService.getUnit(e, X.UNIVER_SLIDE) == null || this._renderManagerService.has(e) || this._addNewRender(e);
   }
   _currentRender() {
-    const e = this._univerInstanceService.getCurrentUnitForType(M.UNIVER_SLIDE);
+    const e = this._univerInstanceService.getCurrentUnitForType(X.UNIVER_SLIDE);
     return this._renderManagerService.getRenderById(e.getUnitId());
   }
+  // eslint-disable-next-line max-lines-per-function
   _addNewRender(e) {
-    const r = this._univerInstanceService.getUnit(e, M.UNIVER_SLIDE);
+    const r = this._univerInstanceService.getUnit(e, X.UNIVER_SLIDE);
     if (r == null)
       return;
     this._renderManagerService.createRender(e);
     const n = this._renderManagerService.getRenderById(e);
     if (n == null)
       return;
-    const { scene: t, engine: s } = n;
-    s.onTransformChangeObservable.addOnce(() => {
-      this._scrollToCenter();
-    }), s.onTransformChangeObservable.add(() => {
+    const { scene: t, engine: a } = n, i = a.onTransformChangeObservable.add(() => {
+      this._scrollToCenter(), i == null || i.dispose();
+    });
+    a.onTransformChangeObservable.add(() => {
       setTimeout(() => {
         this.createThumbs();
       }, 300);
     }), t.resize(2400, 1800);
-    const i = new X("__mainView__", t, {
+    const o = new N("__mainView__", t, {
       left: 0,
       top: 0,
       bottom: 0,
       right: 0,
+      isRelativeX: !0,
+      isRelativeY: !0,
       isWheelPreventDefaultX: !0
     });
-    t.attachControl(), t.on(pe.wheel, (c, l) => {
-      const g = c;
-      if (g.ctrlKey) {
-        const p = Math.abs(g.deltaX);
-        let d = p < 40 ? 0.2 : p < 80 ? 0.4 : 0.2;
-        d *= g.deltaY > 0 ? -1 : 1, t.scaleX < 1 && (d /= 2), t.scaleX + d > 4 ? t.scale(4, 4) : t.scaleX + d < 0.1 ? t.scale(0.1, 0.1) : (g.deltaY > 0, g.preventDefault());
+    t.attachControl(), t.on(ue.wheel, (l, f) => {
+      const h = l;
+      if (h.ctrlKey) {
+        const g = Math.abs(h.deltaX);
+        let d = g < 40 ? 0.2 : g < 80 ? 0.4 : 0.2;
+        d *= h.deltaY > 0 ? -1 : 1, t.scaleX < 1 && (d /= 2), t.scaleX + d > 4 ? t.scale(4, 4) : t.scaleX + d < 0.1 ? t.scale(0.1, 0.1) : (h.deltaY > 0, h.preventDefault());
       } else
-        i.onMouseWheel(g, l);
+        o.onMouseWheel(h, f);
     }), t.onFileLoadedObservable.add(() => {
       this._refreshThumb();
-    }), ue.attachTo(i), this._renderManagerService.setCurrent(e);
-    const o = this._createSlide(t);
-    n.mainComponent = o, n.components.set("__slideRender__", o), this._createSlidePages(r, o), s.runRenderLoop(() => {
+    }), pe.attachTo(o), this._renderManagerService.setCurrent(e);
+    const c = this._createSlide(t);
+    n.mainComponent = c, n.components.set("__slideRender__", c), this._createSlidePages(r, c), a.runRenderLoop(() => {
       t.render();
-      const c = document.getElementById("app");
-      c && (c.innerText = `fps:${Math.round(s.getFps()).toString()}`);
+      const l = document.getElementById("app");
+      l && (l.innerText = `fps:${Math.round(a.getFps()).toString()}`);
     });
   }
   _createSlide(e) {
-    const r = this._univerInstanceService.getCurrentUnitForType(M.UNIVER_SLIDE), { width: n, height: t } = e, s = r.getPageSize(), { width: i = 100, height: o = 100 } = s, c = new Oe("__slideRender__", {
+    const r = this._univerInstanceService.getCurrentUnitForType(X.UNIVER_SLIDE), { width: n, height: t } = e, a = r.getPageSize(), { width: i = 100, height: o = 100 } = a, c = new Oe("__slideRender__", {
       left: (n - i) / 2,
       top: (t - o) / 2,
       width: i,
@@ -790,10 +798,10 @@ let ee = class extends We {
     return c.enableNav(), c.enableSelectedClipElement(), e.addObject(c), c;
   }
   _addBackgroundRect(e, r) {
-    const t = this._univerInstanceService.getCurrentUnitForType(M.UNIVER_SLIDE).getPageSize(), { width: s = 0, height: i = 0 } = t, o = new Y("canvas", {
+    const t = this._univerInstanceService.getCurrentUnitForType(X.UNIVER_SLIDE).getPageSize(), { width: a = 0, height: i = 0 } = t, o = new H("canvas", {
       left: 0,
       top: 0,
-      width: s,
+      width: a,
       height: i,
       strokeWidth: 1,
       stroke: "rgba(198,198,198, 1)",
@@ -806,9 +814,9 @@ let ee = class extends We {
   _getCenterPositionViewPort(e) {
     if (!e)
       return { left: 0, top: 0 };
-    const { width: r, height: n } = e, t = e.getEngine(), s = (t == null ? void 0 : t.width) || 0, i = (t == null ? void 0 : t.height) || 0;
+    const { width: r, height: n } = e, t = e.getEngine(), a = (t == null ? void 0 : t.width) || 0, i = (t == null ? void 0 : t.height) || 0;
     return {
-      left: (r - s) / 2,
+      left: (r - a) / 2,
       top: (n - i) / 2
     };
   }
@@ -819,23 +827,23 @@ let ee = class extends We {
     const { engine: t } = n;
     if (t == null)
       return;
-    const { width: s, height: i } = r, { width: o = s, height: c = i } = t, l = t.getCanvas().getContext();
-    r.renderToThumb(l, e, o / s, c / i);
+    const { width: a, height: i } = r, { width: o = a, height: c = i } = t, l = t.getCanvas().getContext();
+    r.renderToThumb(l, e, o / a, c / i);
   }
   _createSlidePages(e, r) {
     const n = e.getPages(), t = e.getPageOrder();
     if (!(!n || !t) && t.length !== 0) {
-      for (let s = 0, i = t.length; s < i; s++) {
-        const o = t[s];
+      for (let a = 0, i = t.length; a < i; a++) {
+        const o = t[a];
         this._createScene(o, n[o]), this._createThumb(o);
       }
       this._activePageId = t[0], r.activeFirstPage();
     }
   }
   createThumbs() {
-    const r = this._univerInstanceService.getCurrentUnitForType(M.UNIVER_SLIDE).getPageOrder(), n = this._currentRender();
+    const r = this._univerInstanceService.getCurrentUnitForType(X.UNIVER_SLIDE).getPageOrder(), n = this._currentRender();
     if (!(!r || !n) && r.length !== 0)
-      for (let t = 0, s = r.length; t < s; t++) {
+      for (let t = 0, a = r.length; t < a; t++) {
         const i = r[t];
         this._thumbSceneRender(i, n.mainComponent);
       }
@@ -847,24 +855,28 @@ let ee = class extends We {
     const n = this._currentRender();
     if (!n || !this._objectProvider)
       return;
-    const { scene: t, mainComponent: s } = n, i = s, { width: o, height: c } = i, l = new ie(e, i, {
+    const { scene: t, mainComponent: a } = n, i = a, { width: o, height: c } = i, l = new ie(e, i, {
       width: o,
       height: c
     });
-    new X(`PageViewer_${e}`, l, {
+    new N(`PageViewer_${e}`, l, {
       left: 0,
       top: 0,
       bottom: 0,
-      right: 0
+      right: 0,
+      isRelativeX: !0,
+      isRelativeY: !0
     }).closeClip();
-    const { pageElements: p, pageBackgroundFill: d } = r, u = this._objectProvider.convertToRenderObjects(p, t);
-    if (!u || !i)
+    const { pageElements: h, pageBackgroundFill: g } = r, d = this._objectProvider.convertToRenderObjects(h, t);
+    if (!d || !i)
       return;
-    l.openTransformer(), this._addBackgroundRect(l, d), l.addObjects(u);
-    const _ = l.getTransformer();
-    return _ == null || _.onChangeEndObservable.add(() => {
+    this._addBackgroundRect(l, g), l.addObjects(d), d.forEach((_) => {
+      l.attachTransformerTo(_);
+    });
+    const p = l.getTransformer();
+    return p == null || p.onChangeEndObservable.add(() => {
       this._thumbSceneRender(this._activePageId, i);
-    }), _ == null || _.onClearControlObservable.add(() => {
+    }), p == null || p.onClearControlObservable.add(() => {
       this._thumbSceneRender(this._activePageId, i);
     }), i.addPage(l), l;
   }
@@ -872,31 +884,29 @@ let ee = class extends We {
     this._objectProvider = e.createInstance(re);
   }
 };
-ee = Ct([
-  Ae(Ue.Ready, ee),
-  ce(0, Pe),
-  ce(1, A(se)),
+ee = xt([
+  Ae(Ye.Ready, ee),
+  ce(0, be),
+  ce(1, A(ae)),
   ce(2, Qe)
 ], ee);
-var Mt = Object.defineProperty, Lt = Object.getOwnPropertyDescriptor, Nt = (a, e, r, n) => {
-  for (var t = n > 1 ? void 0 : n ? Lt(e, r) : e, s = a.length - 1, i; s >= 0; s--)
-    (i = a[s]) && (t = (n ? i(e, r, t) : i(t)) || t);
-  return n && t && Mt(e, r, t), t;
-}, oe = (a, e) => (r, n) => e(r, n, a);
-const zt = {}, Vt = "slides";
+var jt = Object.defineProperty, Mt = Object.getOwnPropertyDescriptor, Xt = (s, e, r, n) => {
+  for (var t = n > 1 ? void 0 : n ? Mt(e, r) : e, a = s.length - 1, i; a >= 0; a--)
+    (i = s[a]) && (t = (n ? i(e, r, t) : i(t)) || t);
+  return n && t && jt(e, r, t), t;
+}, oe = (s, e) => (r, n) => e(r, n, s);
+const Lt = {}, Vt = "slides";
 var Q;
-let be = (Q = class extends He {
+let Pe = (Q = class extends $e {
   constructor(e = {}, r, n, t) {
     super();
-    h(this, "_config");
-    h(this, "_canvasEngine", null);
-    h(this, "_canvasView", null);
-    this._univerInstanceService = r, this._localeService = n, this._injector = t, this._config = Object.assign(zt, e), this._initializeDependencies(this._injector);
+    u(this, "_config");
+    u(this, "_canvasEngine", null);
+    u(this, "_canvasView", null);
+    this._univerInstanceService = r, this._localeService = n, this._injector = t, this._config = Object.assign(Lt, e), this._initializeDependencies(this._injector);
   }
   initialize() {
-    this._localeService.load({
-      zhCN: tt
-    }), this.initCanvasEngine();
+    this.initCanvasEngine();
   }
   getConfig() {
     return this._config;
@@ -918,17 +928,14 @@ let be = (Q = class extends He {
       e.add(n);
     });
   }
-}, h(Q, "pluginName", Vt), h(Q, "type", M.UNIVER_SLIDE), Q);
-be = Nt([
-  oe(1, Pe),
+}, u(Q, "pluginName", Vt), u(Q, "type", X.UNIVER_SLIDE), Q);
+Pe = Xt([
+  oe(1, be),
   oe(2, A(ne)),
-  oe(3, A(se))
-], be);
+  oe(3, A(ae))
+], Pe);
 export {
   ee as CanvasView,
-  jt as SLIDE_KEY,
-  be as UniverSlidesPlugin,
-  Yt as enUS,
-  Ft as ruRU,
-  tt as zhCN
+  Ct as SLIDE_KEY,
+  Pe as UniverSlidesPlugin
 };