@univerjs/slides 0.1.16 → 0.2.0

package/lib/es/index.js

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