@netless/app-slide 0.0.56 → 0.1.0

package/dist/main.es.js

@@ -17,99 +17,6 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-function clamp$1(value, min, max) {
-  return Math.min(Math.max(value, min), max);
-}
-function isObj(obj) {
-  return typeof obj === "object" && obj !== null;
-}
-function deepClone(obj) {
-  return JSON.parse(JSON.stringify(obj));
-}
-class Logger {
-  constructor(enable) {
-    this.enable = enable;
-    this.apps = {};
-    this.level = "debug";
-    this._onMessage = (ev) => {
-      if (isObj(ev.data)) {
-        if (typeof ev.data.slide === "boolean") {
-          this.enable = ev.data.slide;
-        } else if (ev.data.slide === "__instance") {
-          console.log(this);
-        }
-      }
-    };
-    window.addEventListener("message", this._onMessage);
-  }
-  log(...args) {
-    if (this.enable) {
-      console.log(...args);
-    }
-  }
-  verbose(...args) {
-    if (this.enable && this.level === "verbose") {
-      console.log(...args);
-    }
-  }
-  dispose(appId) {
-    this.enable = false;
-    delete this.apps[appId];
-    window.removeEventListener("message", this._onMessage);
-  }
-}
-const logger = new Logger(false);
-const log = logger.log.bind(logger);
-const verbose = logger.verbose.bind(logger);
-let useFreezer = false;
-const FreezerLength = 2;
-const apps = {
-  map: new Map(),
-  queue: [],
-  validateQueue() {
-    log("[Slide] freezer: validate", this.queue);
-    while (this.queue.length > FreezerLength) {
-      const appId = this.queue.pop();
-      const slide = this.map.get(appId);
-      if (slide) {
-        log("[Slide] freezer: validate-freeze", appId, this.queue);
-        slide.freeze();
-      }
-    }
-  },
-  set(appId, slide) {
-    log("[Slide] freezer: add", appId, this.queue);
-    this.map.set(appId, slide);
-    if (!this.queue.includes(appId)) {
-      this.queue.unshift(appId);
-    }
-    this.validateQueue();
-  },
-  delete(appId) {
-    log("[Slide] freezer: delete", appId, this.queue);
-    this.map.delete(appId);
-    this.queue = this.queue.filter((id) => id !== appId);
-  },
-  focus(appId) {
-    const slide = this.map.get(appId);
-    const index = this.queue.indexOf(appId);
-    if (index > -1) {
-      this.queue.splice(index, 1);
-    }
-    this.queue.unshift(appId);
-    this.validateQueue();
-    log("[Slide] freezer: focus", appId, this.queue);
-    if (slide) {
-      slide.unfreeze();
-    }
-  }
-};
-const addHooks = (emitter) => {
-  useFreezer = true;
-  emitter.on("focus", ({ appId }) => {
-    apps.focus(appId);
-  });
-};
 const e = "!#%()*+,-./:;=?@[]^_`{|}~ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789", s = e.length, t = Array(20), r = () => {
   for (let r2 = 0; r2 < 20; r2++)
     t[r2] = e.charAt(Math.random() * s);
@@ -117,7 +24,7 @@ const e = "!#%()*+,-./:;=?@[]^_`{|}~ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqr
 };
 class o {
   constructor() {
-    this.disposers = new Map();
+    this.disposers = /* @__PURE__ */ new Map();
   }
   add(e2, s2 = r()) {
     return this.flush(s2), this.disposers.set(s2, e2()), s2;
@@ -165,27 +72,6 @@ class o {
     }), this.disposers.clear();
   }
 }
-function isObject(val) {
-  return val != null && typeof val === "object" && !Array.isArray(val);
-}
-function ensureAttributes(context, initAttrs) {
-  let attrs = context.getAttributes();
-  if (!attrs) {
-    context.setAttributes(initAttrs);
-    attrs = context.getAttributes();
-  }
-  if (!attrs) {
-    throw new Error("[NetlessAppMonaco] No attributes");
-  }
-  if (isObject(initAttrs)) {
-    Object.keys(initAttrs).forEach((key) => {
-      if (!Object.prototype.hasOwnProperty.call(attrs, key)) {
-        context.updateAttributes([key], initAttrs[key]);
-      }
-    });
-  }
-  return attrs;
-}
 var Slide = function(t2) {
   var e2 = {};
   function n(i) {
@@ -203,7 +89,7 @@ var Slide = function(t2) {
       return t3;
     if (4 & e3 && typeof t3 == "object" && t3 && t3.__esModule)
       return t3;
-    var i = Object.create(null);
+    var i = /* @__PURE__ */ Object.create(null);
     if (n.r(i), Object.defineProperty(i, "default", { enumerable: true, value: t3 }), 2 & e3 && typeof t3 != "string")
       for (var r2 in t3)
         n.d(i, r2, function(e4) {
@@ -239,7 +125,7 @@ var Slide = function(t2) {
   function u() {
     this._events = new o2(), this._eventsCount = 0;
   }
-  Object.create && (o2.prototype = Object.create(null), new o2().__proto__ || (r2 = false)), u.prototype.eventNames = function() {
+  Object.create && (o2.prototype = /* @__PURE__ */ Object.create(null), new o2().__proto__ || (r2 = false)), u.prototype.eventNames = function() {
     var t3, e3, n2 = [];
     if (this._eventsCount === 0)
       return n2;
@@ -6052,7 +5938,7 @@ var Slide = function(t2) {
   function u() {
     this._events = new o2(), this._eventsCount = 0;
   }
-  Object.create && (o2.prototype = Object.create(null), new o2().__proto__ || (r2 = false)), u.prototype.eventNames = function() {
+  Object.create && (o2.prototype = /* @__PURE__ */ Object.create(null), new o2().__proto__ || (r2 = false)), u.prototype.eventNames = function() {
     var t3, e3, n2 = [];
     if (this._eventsCount === 0)
       return n2;
@@ -12251,7 +12137,7 @@ var Slide = function(t2) {
     } };
   }
   function Wo(t3, e3) {
-    const n2 = e3.isWebGL2, i2 = new WeakMap();
+    const n2 = e3.isWebGL2, i2 = /* @__PURE__ */ new WeakMap();
     return { get: function(t4) {
       return t4.isInterleavedBufferAttribute && (t4 = t4.data), i2.get(t4);
     }, remove: function(e4) {
@@ -12583,7 +12469,7 @@ var Slide = function(t2) {
     };
   }
   function es(t3) {
-    let e3 = new WeakMap();
+    let e3 = /* @__PURE__ */ new WeakMap();
     function n2(t4, e4) {
       return e4 === pt ? t4.mapping = ct : e4 === ft && (t4.mapping = dt), t4;
     }
@@ -12612,7 +12498,7 @@ var Slide = function(t2) {
       }
       return r3;
     }, dispose: function() {
-      e3 = new WeakMap();
+      e3 = /* @__PURE__ */ new WeakMap();
     } };
   }
   function ns(t3) {
@@ -12649,7 +12535,7 @@ var Slide = function(t2) {
     } };
   }
   function is(t3, e3, n2, i2) {
-    const r3 = {}, o3 = new WeakMap();
+    const r3 = {}, o3 = /* @__PURE__ */ new WeakMap();
     function s3(t4) {
       const a3 = t4.target;
       a3.index !== null && e3.remove(a3.index);
@@ -12788,7 +12674,7 @@ var Slide = function(t2) {
     } };
   }
   function us(t3, e3, n2, i2) {
-    let r3 = new WeakMap();
+    let r3 = /* @__PURE__ */ new WeakMap();
     function o3(t4) {
       const e4 = t4.target;
       e4.removeEventListener("dispose", o3), n2.remove(e4.instanceMatrix), e4.instanceColor !== null && n2.remove(e4.instanceColor);
@@ -12797,7 +12683,7 @@ var Slide = function(t2) {
       const s3 = i2.render.frame, a2 = t4.geometry, l2 = e3.get(t4, a2);
       return r3.get(l2) !== s3 && (e3.update(l2), r3.set(l2, s3)), t4.isInstancedMesh && (t4.hasEventListener("dispose", o3) === false && t4.addEventListener("dispose", o3), n2.update(t4.instanceMatrix, 34962), t4.instanceColor !== null && n2.update(t4.instanceColor, 34962)), l2;
     }, dispose: function() {
-      r3 = new WeakMap();
+      r3 = /* @__PURE__ */ new WeakMap();
     } };
   }
   Zo.physical = { uniforms: Po([Zo.standard.uniforms, { clearcoat: { value: 0 }, clearcoatMap: { value: null }, clearcoatRoughness: { value: 0 }, clearcoatRoughnessMap: { value: null }, clearcoatNormalScale: { value: new ei(1, 1) }, clearcoatNormalMap: { value: null }, sheen: { value: new Dr(0) }, transmission: { value: 0 }, transmissionMap: { value: null }, transmissionSamplerSize: { value: new ei() }, transmissionSamplerMap: { value: null }, thickness: { value: 0 }, thicknessMap: { value: null }, attenuationDistance: { value: 0 }, attenuationColor: { value: new Dr(0) } }]), vertexShader: qo.meshphysical_vert, fragmentShader: qo.meshphysical_frag };
@@ -13451,7 +13337,7 @@ var Slide = function(t2) {
     }, programs: s3 };
   }
   function Da() {
-    let t3 = new WeakMap();
+    let t3 = /* @__PURE__ */ new WeakMap();
     return { get: function(e3) {
       let n2 = t3.get(e3);
       return n2 === void 0 && (n2 = {}, t3.set(e3, n2)), n2;
@@ -13460,7 +13346,7 @@ var Slide = function(t2) {
     }, update: function(e3, n2, i2) {
       t3.get(e3)[n2] = i2;
     }, dispose: function() {
-      t3 = new WeakMap();
+      t3 = /* @__PURE__ */ new WeakMap();
     } };
   }
   function Fa(t3, e3) {
@@ -13498,12 +13384,12 @@ var Slide = function(t2) {
     } };
   }
   function ka(t3) {
-    let e3 = new WeakMap();
+    let e3 = /* @__PURE__ */ new WeakMap();
     return { get: function(n2, i2) {
       let r3;
       return e3.has(n2) === false ? (r3 = new Ua(t3), e3.set(n2, [r3])) : i2 >= e3.get(n2).length ? (r3 = new Ua(t3), e3.get(n2).push(r3)) : r3 = e3.get(n2)[i2], r3;
     }, dispose: function() {
-      e3 = new WeakMap();
+      e3 = /* @__PURE__ */ new WeakMap();
     } };
   }
   function Ga() {
@@ -13640,12 +13526,12 @@ var Slide = function(t2) {
     } };
   }
   function Wa(t3, e3) {
-    let n2 = new WeakMap();
+    let n2 = /* @__PURE__ */ new WeakMap();
     return { get: function(i2, r3 = 0) {
       let o3;
       return n2.has(i2) === false ? (o3 = new Va(t3, e3), n2.set(i2, [o3])) : r3 >= n2.get(i2).length ? (o3 = new Va(t3, e3), n2.get(i2).push(o3)) : o3 = n2.get(i2)[r3], o3;
     }, dispose: function() {
-      n2 = new WeakMap();
+      n2 = /* @__PURE__ */ new WeakMap();
     } };
   }
   class Xa extends Rr {
@@ -13983,7 +13869,7 @@ var Slide = function(t2) {
     } };
   }
   function Ja(t3, e3, n2, i2, r3, o3, s3) {
-    const a2 = r3.isWebGL2, l2 = r3.maxTextures, u2 = r3.maxCubemapSize, h2 = r3.maxTextureSize, c2 = r3.maxSamples, d2 = new WeakMap();
+    const a2 = r3.isWebGL2, l2 = r3.maxTextures, u2 = r3.maxCubemapSize, h2 = r3.maxTextureSize, c2 = r3.maxSamples, d2 = /* @__PURE__ */ new WeakMap();
     let p2, f2 = false;
     try {
       f2 = typeof OffscreenCanvas != "undefined" && new OffscreenCanvas(1, 1).getContext("2d") !== null;
@@ -14460,7 +14346,7 @@ var Slide = function(t2) {
       super();
       const n2 = this, i2 = t3.state;
       let r3 = null, o3 = 1, s3 = null, a2 = "local-floor", l2 = null, u2 = null, h2 = null, c2 = null;
-      const d2 = [], p2 = new Map(), f2 = new Lo();
+      const d2 = [], p2 = /* @__PURE__ */ new Map(), f2 = new Lo();
       f2.layers.enable(1), f2.viewport = new li();
       const m2 = new Lo();
       m2.layers.enable(2), m2.viewport = new li();
@@ -14870,7 +14756,7 @@ var Slide = function(t2) {
       e4.isScene !== true && (e4 = j2);
       const i3 = Z2.get(t4), r4 = d2.state.lights, o4 = d2.state.shadowsArray, s4 = r4.state.version, a3 = et2.getParameters(t4, r4.state, o4, e4, n3), l3 = et2.getProgramCacheKey(a3);
       let u3 = i3.programs;
-      i3.environment = t4.isMeshStandardMaterial ? e4.environment : null, i3.fog = e4.fog, i3.envMap = K2.get(t4.envMap || i3.environment), u3 === void 0 && (t4.addEventListener("dispose", wt2), u3 = new Map(), i3.programs = u3);
+      i3.environment = t4.isMeshStandardMaterial ? e4.environment : null, i3.fog = e4.fog, i3.envMap = K2.get(t4.envMap || i3.environment), u3 === void 0 && (t4.addEventListener("dispose", wt2), u3 = /* @__PURE__ */ new Map(), i3.programs = u3);
       let h3 = u3.get(l3);
       if (h3 !== void 0) {
         if (i3.currentProgram === h3 && i3.lightsStateVersion === s4)
@@ -22440,7 +22326,7 @@ var Slide = function(t2) {
       i2 === void 0 ? console.warn("PixiJS Deprecation Warning: ", e3 + "\nDeprecated since v" + t3) : (i2 = i2.split("\n").splice(n2).join("\n"), console.groupCollapsed ? (console.groupCollapsed("%cPixiJS Deprecation Warning: %c%s", "color:#614108;background:#fffbe6", "font-weight:normal;color:#614108;background:#fffbe6", e3 + "\nDeprecated since v" + t3), console.warn(i2), console.groupEnd()) : (console.warn("PixiJS Deprecation Warning: ", e3 + "\nDeprecated since v" + t3), console.warn(i2))), Yv[e3] = true;
     }
   }
-  var Jv = {}, Kv = Object.create(null), $v = Object.create(null);
+  var Jv = {}, Kv = /* @__PURE__ */ Object.create(null), $v = /* @__PURE__ */ Object.create(null);
   function Qv() {
     var t3;
     for (t3 in Kv)
@@ -28216,7 +28102,7 @@ var Slide = function(t2) {
       return n2.dropShadow && (m2 += n2.dropShadowDistance), new t3(e3, n2, p2, m2, l2, u2, f2 + n2.leading, h2, s3);
     }, t3.wordWrap = function(e3, n2, i2) {
       i2 === void 0 && (i2 = t3._canvas);
-      for (var r3 = i2.getContext("2d"), o3 = 0, s3 = "", a2 = "", l2 = Object.create(null), u2 = n2.letterSpacing, h2 = n2.whiteSpace, c2 = t3.collapseSpaces(h2), d2 = t3.collapseNewlines(h2), p2 = !c2, f2 = n2.wordWrapWidth + u2, m2 = t3.tokenize(e3), g2 = 0; g2 < m2.length; g2++) {
+      for (var r3 = i2.getContext("2d"), o3 = 0, s3 = "", a2 = "", l2 = /* @__PURE__ */ Object.create(null), u2 = n2.letterSpacing, h2 = n2.whiteSpace, c2 = t3.collapseSpaces(h2), d2 = t3.collapseNewlines(h2), p2 = !c2, f2 = n2.wordWrapWidth + u2, m2 = t3.tokenize(e3), g2 = 0; g2 < m2.length; g2++) {
         var v2 = m2[g2];
         if (t3.isNewline(v2)) {
           if (!d2) {
@@ -30188,7 +30074,7 @@ void main() {
     calcFps() {
       requestAnimationFrame((t3) => {
         const e3 = t3 - this.prevTime;
-        this.valueTotal += e3, this.times += 1, this.times > 20 && (this.value = Math.floor(800 * this.times / this.valueTotal), this.valueTotal = 0, this.times = 0, this.destroyed || this.emit("update", this.value)), this.prevTime = t3, this.destroyed || this.calcFps();
+        this.valueTotal += e3, this.times += 1, this.times > 20 && (this.value = Math.floor(1e3 * this.times / this.valueTotal), this.valueTotal = 0, this.times = 0, this.destroyed || this.emit("update", this.value)), this.prevTime = t3, this.destroyed || this.calcFps();
       });
     }
     destroy() {
@@ -30459,7 +30345,7 @@ void main() {
   };
   class aM {
     constructor(t3) {
-      this.gifs = Object.create(null), this.textures = Object.create(null), this.frames = Object.create(null), this.spriteSheets = [], this.loader = t3;
+      this.gifs = /* @__PURE__ */ Object.create(null), this.textures = /* @__PURE__ */ Object.create(null), this.frames = /* @__PURE__ */ Object.create(null), this.spriteSheets = [], this.loader = t3;
     }
     getTexture(t3) {
       return this.textures[t3] || null;
@@ -30492,7 +30378,7 @@ void main() {
       });
     }
     destroy() {
-      this.spriteSheets.forEach((t3) => t3.destroy(true)), this.spriteSheets = [], this.gifs = Object.create(null), this.textures = Object.create(null), this.frames = Object.create(null);
+      this.spriteSheets.forEach((t3) => t3.destroy(true)), this.spriteSheets = [], this.gifs = /* @__PURE__ */ Object.create(null), this.textures = /* @__PURE__ */ Object.create(null), this.frames = /* @__PURE__ */ Object.create(null);
     }
   }
   var lM = n(3), uM = n.n(lM);
@@ -30590,7 +30476,7 @@ void main() {
   };
   class gM {
     constructor() {
-      this.imgElements = [], this.svgElements = [], this.idToHashMap = Object.create(null), this.textures = Object.create(null), this.graphics = [], this.hashToIdMap = Object.create(null);
+      this.imgElements = [], this.svgElements = [], this.idToHashMap = /* @__PURE__ */ Object.create(null), this.textures = /* @__PURE__ */ Object.create(null), this.graphics = [], this.hashToIdMap = /* @__PURE__ */ Object.create(null);
     }
     render(t3, e3, n2) {
       return mM(this, void 0, void 0, function* () {
@@ -30687,7 +30573,7 @@ void main() {
       Object.keys(this.textures).forEach((t3) => {
         var e3;
         (e3 = this.textures[t3]) === null || e3 === void 0 || e3.texture.destroy(true);
-      }), this.textures = Object.create(null), this.imgElements.forEach((t3) => fM.collectObject(t3)), this.svgElements.forEach((t3) => pM.collectObject(t3)), this.graphics = [];
+      }), this.textures = /* @__PURE__ */ Object.create(null), this.imgElements.forEach((t3) => fM.collectObject(t3)), this.svgElements.forEach((t3) => pM.collectObject(t3)), this.graphics = [];
     }
   }
   class vM {
@@ -30706,7 +30592,7 @@ void main() {
   }
   class _M {
     constructor(t3) {
-      this.eventHub = t3, this.targets = Object.create(null);
+      this.eventHub = t3, this.targets = /* @__PURE__ */ Object.create(null);
     }
     getTargets() {
       return Object.keys(this.targets).map((t3) => this.targets[t3]);
@@ -30723,7 +30609,7 @@ void main() {
       return t3.type !== "shape" ? o3 : (t3.type === "shape" && t3.txEl && (o3 = (i2 = o3 == null ? void 0 : o3.getTextElement(t3.txEl.type, t3.txEl.range)) !== null && i2 !== void 0 ? i2 : null), t3.type === "shape" && t3.bg && n2.index === 0 && (e3 = false, o3 = (r3 = o3 == null ? void 0 : o3.getBgElement()) !== null && r3 !== void 0 ? r3 : null, this.eventHub.emit("IterateTimeNodeEnd", n2.id)), e3 && o3 ? o3.getIterateEntry(n2.type, n2.index, n2.id) : (o3 || this.eventHub.emit("IterateTimeNodeEnd", n2.id), o3));
     }
     clearTargets() {
-      this.targets = Object.create(null);
+      this.targets = /* @__PURE__ */ Object.create(null);
     }
   }
   class yM {
@@ -34004,7 +33890,7 @@ void main(void){
   };
   class kR {
     constructor(t3, e3, n2, i2, r3, o3, s3) {
-      this.loader = t3, this.mode = e3, this.renderer = n2, this.ticker = i2, this.view = r3, this.clock = o3, this.objPoolGroup = s3, this.currentStageIndex = 0, this.cacheCount = BR.isDesktop() ? 2 : 1, this.stageStates = Object.create(null), this.stageJsons = Object.create(null), this.stageCtxs = Object.create(null), this.stageImpls = Object.create(null), this.taskId = "", this.url = "", this.microTaskManager = new RR(i2);
+      this.loader = t3, this.mode = e3, this.renderer = n2, this.ticker = i2, this.view = r3, this.clock = o3, this.objPoolGroup = s3, this.currentStageIndex = 0, this.cacheCount = BR.isDesktop() ? 2 : 1, this.stageStates = /* @__PURE__ */ Object.create(null), this.stageJsons = /* @__PURE__ */ Object.create(null), this.stageCtxs = /* @__PURE__ */ Object.create(null), this.stageImpls = /* @__PURE__ */ Object.create(null), this.taskId = "", this.url = "", this.microTaskManager = new RR(i2);
     }
     setSnapshotCache(t3) {
       this.snapshotCache = t3;
@@ -34015,7 +33901,7 @@ void main(void){
     createCtx(t3) {
       const { task: e3 } = this.stageStates[t3];
       e3.addMTask(() => {
-        const e4 = new aM(this.loader), n2 = new a.a(), i2 = { mode: this.mode, renderer: this.renderer, graphicsTexture: new gM(), stageWidth: 0, stageHeight: 0, ticker: this.ticker, timingTargets: new _M(n2), eventHub: n2, view: this.view, medias: Object.create(null), lastViewedIndex: 0, conflictTimeNodeManager: new vM(), clock: this.clock, spriteTexture: e4, slideIndex: t3, objectPoolGroup: this.objPoolGroup, hasBackgroundFillShape: false, slideScopeEventHub: new a.a() };
+        const e4 = new aM(this.loader), n2 = new a.a(), i2 = { mode: this.mode, renderer: this.renderer, graphicsTexture: new gM(), stageWidth: 0, stageHeight: 0, ticker: this.ticker, timingTargets: new _M(n2), eventHub: n2, view: this.view, medias: /* @__PURE__ */ Object.create(null), lastViewedIndex: 0, conflictTimeNodeManager: new vM(), clock: this.clock, spriteTexture: e4, slideIndex: t3, objectPoolGroup: this.objPoolGroup, hasBackgroundFillShape: false, slideScopeEventHub: new a.a() };
         return this.stageCtxs[t3] = i2, Promise.resolve();
       });
     }
@@ -34147,7 +34033,7 @@ void main(void){
       }, this.fps.on("update", (t4) => {
         if (t4 < this.config.minFPS) {
           if (this.config.autoResolution) {
-            const t5 = this.scale * this.config.resolution * 0.7, e4 = this.app.renderer.resolution, n3 = Math.max(t5, e4 - 0.1);
+            const t5 = 0.7 * this.scale, e4 = this.app.renderer.resolution, n3 = Math.max(t5, e4 - 0.1);
             n3 >= t5 && this.updateResolution(n3);
           }
           if (this.config.autoFPS) {
@@ -34262,7 +34148,7 @@ void main(void){
     updateResolution(t3) {
       this.app.ticker.addOnce(() => {
         let e3 = BR.isDesktop() ? t3 : 1;
-        for (; e3 * this.designWidth > 2560 || e3 * this.designHeight > 2560; )
+        for (; e3 * this.designWidth > 5120 || e3 * this.designHeight > 5120; )
           e3 -= 0.1;
         this.app.renderer.resolution = e3, this.app.renderer.plugins.interaction.resolution = this.app.renderer.resolution, this.app.renderer.resize(this.designWidth, this.designHeight);
       });
@@ -34401,7 +34287,7 @@ void main(void){
       return true;
     var i2 = (n2 = (e3 = t3) === null || e3 === void 0 ? void 0 : e3.ownerDocument) === null || n2 === void 0 ? void 0 : n2.defaultView;
     return !!(i2 && t3 instanceof i2.Element);
-  }, tP = typeof window != "undefined" ? window : {}, eP = new WeakMap(), nP = /auto|scroll/, iP = /^tb|vertical/, rP = /msie|trident/i.test(tP.navigator && tP.navigator.userAgent), oP = function(t3) {
+  }, tP = typeof window != "undefined" ? window : {}, eP = /* @__PURE__ */ new WeakMap(), nP = /auto|scroll/, iP = /^tb|vertical/, rP = /msie|trident/i.test(tP.navigator && tP.navigator.userAgent), oP = function(t3) {
     return parseFloat(t3 || "0");
   }, sP = function(t3, e3, n2) {
     return t3 === void 0 && (t3 = 0), e3 === void 0 && (e3 = 0), n2 === void 0 && (n2 = false), new ZR((n2 ? e3 : t3) || 0, (n2 ? t3 : e3) || 0);
@@ -34547,7 +34433,7 @@ void main(void){
     }, t3;
   }(), EP = function(t3, e3) {
     this.activeTargets = [], this.skippedTargets = [], this.observationTargets = [], this.observer = t3, this.callback = e3;
-  }, MP = new WeakMap(), AP = function(t3, e3) {
+  }, MP = /* @__PURE__ */ new WeakMap(), AP = function(t3, e3) {
     for (var n2 = 0; n2 < t3.length; n2 += 1)
       if (t3[n2].target === e3)
         return n2;
@@ -34721,7 +34607,7 @@ void main(void){
       });
     }
     return t3.prototype.replaceIdleTask = function() {
-      for (var t4, e3 = this, n2 = new Set(), i2 = 0, r3 = this.tasks.length; i2 < r3; i2++)
+      for (var t4, e3 = this, n2 = /* @__PURE__ */ new Set(), i2 = 0, r3 = this.tasks.length; i2 < r3; i2++)
         this.tasks[i2].state === "idle" && ((t4 = this.tasks[i2 + 1]) === null || t4 === void 0 ? void 0 : t4.state) === "idle" && n2.add(i2);
       Array.from(n2).forEach(function(t5) {
         e3.tasks.splice(t5, 1);
@@ -35701,11 +35587,13 @@ void main(void){
     return t3.prototype.createStats = function() {
       var t4 = this;
       this.stateId = setInterval(function() {
-        t4.player.view && (t4.controller.runTimeFps.setValue(t4.player.runtime.fps), t4.controller.runTimeResolution.setValue(t4.player.view.width + "*" + t4.player.view.height));
+        t4.player.view && (t4.controller.runTimeFps.setValue(t4.player.fps.value), t4.controller.drawCall.setValue(t4.player.runtime.drawCall), t4.controller.runTimeResolution.setValue(t4.player.view.width + "*" + t4.player.view.height));
       }, 500);
     }, t3.prototype.createControllerGUI = function() {
       var t4, e3, n2, i2, r3, o3 = new GC({ autoPlace: true, closed: true });
-      return o3.domElement.style.opacity = ".6", o3.domElement.style.transformOrigin = "100% 0", o3.domElement.style.transform = "scale(1.4)", this.target.appendChild(o3.domElement), o3.domElement.style.position = "absolute", o3.domElement.style.right = "0", o3.domElement.style.top = "0", o3.domElement.style.zIndex = "2", this.controller = { runTimeFps: o3.add({ FPS: 0 }, "FPS", 0), runTimeResolution: o3.add({ "\u5206\u8FA8\u7387": "" }, "\u5206\u8FA8\u7387", ""), autoResolution: o3.add({ "\u81EA\u52A8\u5206\u8FA8\u7387": (t4 = this.data.autoResolution) !== null && t4 !== void 0 && t4 }, "\u81EA\u52A8\u5206\u8FA8\u7387", true), autoFps: o3.add({ "\u81EA\u52A8fps": (e3 = this.data.autoFPS) === null || e3 === void 0 || e3 }, "\u81EA\u52A8fps", true), moreCalculation: o3.add({ "\u989D\u5916\u8BA1\u7B97": 0 }, "\u989D\u5916\u8BA1\u7B97", 0, 100), minFPS: o3.add({ "\u6700\u4F4Efps": (n2 = this.data.minFPS) !== null && n2 !== void 0 ? n2 : 40 }, "\u6700\u4F4Efps", 0, 60), maxFPS: o3.add({ "\u6700\u9AD8fps": (i2 = this.data.maxFPS) !== null && i2 !== void 0 ? i2 : 50 }, "\u6700\u9AD8fps", 0, 60), resolution: o3.add({ "\u76EE\u6807\u5206\u8FA8\u500D\u7387": (r3 = this.data.resolution) !== null && r3 !== void 0 ? r3 : window.devicePixelRatio }, "\u76EE\u6807\u5206\u8FA8\u500D\u7387", 0.5, 4) }, this.controller.runTimeFps.disabled = true, this.controller.runTimeResolution.disabled = true, o3;
+      o3.domElement.style.opacity = ".6", o3.domElement.style.transformOrigin = "100% 0", o3.domElement.style.transform = "scale(1)", this.target.appendChild(o3.domElement), o3.domElement.style.position = "absolute", o3.domElement.style.right = "0", o3.domElement.style.top = "0", o3.domElement.style.zIndex = "2";
+      var s3 = o3.add({ FPS: 0 }, "FPS", 0), a2 = o3.add({ drawCall: 0 }, "drawCall", 0), l2 = o3.add({ "\u5206\u8FA8\u7387": "" }, "\u5206\u8FA8\u7387", ""), u2 = o3.add({ "\u989D\u5916\u8BA1\u7B97": 0 }, "\u989D\u5916\u8BA1\u7B97", 0, 200), h2 = o3.addFolder("renderOptions");
+      return this.controller = { runTimeResolution: l2, runTimeFps: s3, drawCall: a2, moreCalculation: u2, minFPS: h2.add({ "\u6700\u4F4Efps": (t4 = this.data.minFPS) !== null && t4 !== void 0 ? t4 : 40 }, "\u6700\u4F4Efps", 0, 60), maxFPS: h2.add({ "\u6700\u9AD8fps": (e3 = this.data.maxFPS) !== null && e3 !== void 0 ? e3 : 50 }, "\u6700\u9AD8fps", 0, 60), resolution: h2.add({ "\u76EE\u6807\u5206\u8FA8\u500D\u7387": (n2 = this.data.resolution) !== null && n2 !== void 0 ? n2 : window.devicePixelRatio }, "\u76EE\u6807\u5206\u8FA8\u500D\u7387", 0.5, 6), autoResolution: h2.add({ "\u81EA\u52A8\u5206\u8FA8\u7387": (i2 = this.data.autoResolution) !== null && i2 !== void 0 && i2 }, "\u81EA\u52A8\u5206\u8FA8\u7387", true), autoFps: h2.add({ "\u81EA\u52A8fps": (r3 = this.data.autoFPS) === null || r3 === void 0 || r3 }, "\u81EA\u52A8fps", true), transactionBgColor: h2.addColor({ "\u5207\u9875\u80CC\u666F\u8272": this.data.transactionBgColor }, "\u5207\u9875\u80CC\u666F\u8272") }, this.controller.runTimeFps.disabled = true, this.controller.runTimeResolution.disabled = true, o3;
     }, t3.prototype.addEventListener = function() {
       var t4, e3 = this;
       this.controller.autoFps.onChange(function(t5) {
@@ -35718,6 +35606,8 @@ void main(void){
         e3.data.autoResolution = t5, e3.player.updateConfig(e3.data);
       }), this.controller.resolution.onChange(function(t5) {
         e3.data.resolution = t5, e3.player.updateConfig(e3.data);
+      }), this.controller.transactionBgColor.onChange(function(t5) {
+        e3.data.transactionBgColor = t5, e3.player.updateConfig(e3.data);
       }), this.controller.moreCalculation.onChange(function(n2) {
         t4 && e3.player.app.ticker.remove(t4), n2 > 0 && (t4 = function() {
           for (var t5 = ""; t5.length < 8e3 * n2; )
@@ -35746,7 +35636,7 @@ void main(void){
     }, t3;
   }(), jC = function() {
     function t3() {
-      this.autoUnlock = Object.create(null), this.locks = Object.create(null);
+      this.autoUnlock = /* @__PURE__ */ Object.create(null), this.locks = /* @__PURE__ */ Object.create(null);
     }
     return t3.prototype.addLock = function(t4, e3) {
       var n2 = this;
@@ -35893,9 +35783,9 @@ void main(void){
       });
     });
   }
-  var $C = { syncDispatch: "syncDispatch", syncReceive: "syncReceive", renderStart: "renderStart", renderEnd: "renderEnd", renderError: "renderError", slideChange: "slideChange", mainSeqStepStart: "mainSeqStepStart", mainSeqStepEnd: "mainSeqStepEnd", animateStart: "animateStart", animateEnd: "animateEnd", stateChange: "stateChange" }, QC = { taskId: "", url: "", currentSlideIndex: -1, mainSeqStep: -1, mainSeqState: null, mediaState: Object.create(null), interactiveSeqState: Object.create(null) }, tI = "";
+  var $C = { syncDispatch: "syncDispatch", syncReceive: "syncReceive", renderStart: "renderStart", renderEnd: "renderEnd", renderError: "renderError", slideChange: "slideChange", mainSeqStepStart: "mainSeqStepStart", mainSeqStepEnd: "mainSeqStepEnd", animateStart: "animateStart", animateEnd: "animateEnd", stateChange: "stateChange" }, QC = { taskId: "", url: "", currentSlideIndex: -1, mainSeqStep: -1, mainSeqState: null, mediaState: /* @__PURE__ */ Object.create(null), interactiveSeqState: /* @__PURE__ */ Object.create(null) }, tI = "";
   try {
-    tI = "0.2.2";
+    tI = "0.2.6";
   } catch (t3) {
     tI = "dev";
   }
@@ -36020,7 +35910,7 @@ void main(void){
       }), n2.renderingTaskManager.eventHub.on("task-error", function(t4) {
         var e5 = t4.error, i2 = t4.task;
         n2.emit($C.renderError, { error: e5, index: i2.slideIndex });
-      }), window.addEventListener("__slide_log__", n2.handleLogDownload), window.addEventListener("__slide_state__", n2.handleSlideStateLog), window.addEventListener("__slide_ref__", n2.handleSlideRef), n2.persistLogId = window.setInterval(n2.persistLog, 5e3), n2.resizeView = Object(l.debounce)(n2.resizeView.bind(n2), 50), n2.player = n2.initPlayer(e4), n2.player.view && n2.frame.appendChild(n2.player.view), n2.handleViewClick = Object(l.debounce)(n2.handleViewClick, 300), n2;
+      }), window.addEventListener("__slide_log__", n2.handleLogDownload), window.addEventListener("__slide_state__", n2.handleSlideStateLog), window.addEventListener("__slide_ref__", n2.handleSlideRef), n2.persistLogId = window.setInterval(n2.persistLog, 5e3), n2.resizeView = Object(l.debounce)(n2.resizeView.bind(n2), 50), n2.player = n2.initPlayer(e4), (e4 == null ? void 0 : e4.controller) && n2.createController(), n2.player.view && n2.frame.appendChild(n2.player.view), n2.handleViewClick = Object(l.debounce)(n2.handleViewClick, 300), n2;
     }
     return VC(e3, t3), e3.prototype.initPlayer = function(t4) {
       var e4, n2, i2, r3 = this, o3 = new jR(this.mode);
@@ -36057,7 +35947,7 @@ void main(void){
       }), o3.on(zR.mediaSeek, function(t5) {
         var e5 = { type: "pause", time: 0 };
         t5.isPlaying ? (e5.type = "play", r3.__slideState.mediaState[t5.id] ? e5.time = r3.__slideState.mediaState[t5.id].time - 1e3 * t5.time : e5.time = r3.timestamp() - 1e3 * t5.time, r3.__slideState.mediaState[t5.id] = e5) : (e5.type = "pause", e5.time = t5.time, r3.__slideState.mediaState[t5.id] = e5), r3.emitSyncDispatch({ slideIndex: r3.__slideState.currentSlideIndex, type: "mediaSeek", id: t5.id, time: t5.time, state: e5 }), r3.emitStateChange();
-      }), o3.on(zR.requestPrevSlide, this.handlePrevSlide), o3.on(zR.requestNextSlide, this.handleNextSlide), o3.on(zR.requestGotoSlide, this.handleGotoSlide), (e4 = o3.view) === null || e4 === void 0 || e4.addEventListener("touchend", this.handleViewTouchEnd), (n2 = o3.view) === null || n2 === void 0 || n2.addEventListener("touchstart", this.handleViewTouchStart), (i2 = o3.view) === null || i2 === void 0 || i2.addEventListener("click", this.handleViewClick), o3.on(zR.userInput, this.userInputHandle), (t4 == null ? void 0 : t4.controller) && this.createController(), o3;
+      }), o3.on(zR.requestPrevSlide, this.handlePrevSlide), o3.on(zR.requestNextSlide, this.handleNextSlide), o3.on(zR.requestGotoSlide, this.handleGotoSlide), (e4 = o3.view) === null || e4 === void 0 || e4.addEventListener("touchend", this.handleViewTouchEnd), (n2 = o3.view) === null || n2 === void 0 || n2.addEventListener("touchstart", this.handleViewTouchStart), (i2 = o3.view) === null || i2 === void 0 || i2.addEventListener("click", this.handleViewClick), o3.on(zR.userInput, this.userInputHandle), o3;
     }, e3.prototype.createController = function() {
       this.player && (this.playerController = new HC({ player: this.player, params: this.player.config || {}, target: this.frame }));
     }, e3.prototype.setMedianControllerAttribute = function() {
@@ -36182,21 +36072,21 @@ void main(void){
     }, e3.prototype.poseRenderSlide = function(t4, e4) {
       this.isLoading = true, this.mode === "interactive" ? this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "renderSlide", index: t4, isForward: e4 }) : this.mode === "sync" ? (this.doRenderSlide(t4, e4), this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "renderSlide", index: t4, isForward: e4 })) : this.doRenderSlide(t4, e4);
     }, e3.prototype.doRenderSlide = function(t4, e4) {
-      var n2, i2 = this;
+      var n2, i2, r3, o3 = this;
       if (e4 === void 0 && (e4 = true), !this.player)
         return Promise.resolve();
       if (this.needCreateNewPlayer() && (this.iosResetCache = [], this.iosNewPlayer = this.initPlayer(this.config), this.iosNewPlayer.setResourceData(this.__slideState.taskId, this.__slideState.url)), this.iosNewPlayer) {
-        var r3 = this.player.getSnapshot();
-        this.cacheImage.src = r3, this.frame.appendChild(this.cacheImage), this.player.destroy(), this.player = this.iosNewPlayer, this.iosNewPlayer = void 0, this.needClearCacheImage = true, ((n2 = this == null ? void 0 : this.player) === null || n2 === void 0 ? void 0 : n2.view) && (this.player.view.style.visibility = "hidden", this.frame.appendChild(this.player.view));
+        var s3 = this.player.getSnapshot();
+        this.cacheImage.src = s3, this.frame.appendChild(this.cacheImage), this.player.destroy(), (n2 = this.playerController) === null || n2 === void 0 || n2.destroy(), this.player = this.iosNewPlayer, this.iosNewPlayer = void 0, ((i2 = this.config) === null || i2 === void 0 ? void 0 : i2.controller) && this.createController(), this.needClearCacheImage = true, ((r3 = this == null ? void 0 : this.player) === null || r3 === void 0 ? void 0 : r3.view) && (this.player.view.style.visibility = "hidden", this.frame.appendChild(this.player.view));
       }
-      var o3 = Math.random().toString(32).substr(2);
+      var a2 = Math.random().toString(32).substr(2);
       return this.player.isForward = e4, this.renderingTaskManager.addTask(function() {
-        return i2._renderSlide(t4);
-      }, t4, o3), new Promise(function(t5) {
-        i2.renderingTaskManager.eventHub.once("task-end-" + o3, t5);
+        return o3._renderSlide(t4);
+      }, t4, a2), new Promise(function(t5) {
+        o3.renderingTaskManager.eventHub.once("task-end-" + a2, t5);
       });
     }, e3.prototype.nextStep = function() {
-      !this.isLoading && this.player && (this.player.mainSeqHasNextStep() ? this.mode === "interactive" ? this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "nextStep", next: this.player.mainSeqStep() + 1 }) : this.mode === "sync" ? (this.doNextStep(), this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "nextStep", next: this.player.mainSeqStep() })) : this.doNextStep() : this.handleNextSlide());
+      !this.isLoading && this.player && this.interactive && (this.player.mainSeqHasNextStep() ? this.mode === "interactive" ? this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "nextStep", next: this.player.mainSeqStep() + 1 }) : this.mode === "sync" ? (this.doNextStep(), this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "nextStep", next: this.player.mainSeqStep() })) : this.doNextStep() : this.handleNextSlide());
     }, e3.prototype.doNextStep = function() {
       if (this.player) {
         this.player.nextStep();
@@ -36204,7 +36094,7 @@ void main(void){
         this.__slideState.mainSeqStep = t4, this.emitStateChange();
       }
     }, e3.prototype.prevStep = function() {
-      !this.isLoading && this.player && (this.player.mainSeqHasPrevStep() ? this.mode === "interactive" ? this.emitSyncDispatch({ type: "prevStep", slideIndex: this.__slideState.currentSlideIndex, next: this.player.mainSeqStep() - 1 }) : this.mode === "sync" ? (this.doPrevStep(), this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "prevStep", next: this.player.mainSeqStep() })) : this.doPrevStep() : this.handlePrevSlide());
+      !this.isLoading && this.player && this.interactive && (this.player.mainSeqHasPrevStep() ? this.mode === "interactive" ? this.emitSyncDispatch({ type: "prevStep", slideIndex: this.__slideState.currentSlideIndex, next: this.player.mainSeqStep() - 1 }) : this.mode === "sync" ? (this.doPrevStep(), this.emitSyncDispatch({ slideIndex: this.__slideState.currentSlideIndex, type: "prevStep", next: this.player.mainSeqStep() })) : this.doPrevStep() : this.handlePrevSlide());
     }, e3.prototype.doPrevStep = function() {
       if (this.player) {
         this.player.prevStep();
@@ -36257,23 +36147,23 @@ void main(void){
         });
       });
     }, e3.prototype.release = function() {
-      var t4;
+      var t4, e4;
       return XC(this, void 0, void 0, function() {
-        var e4, n2, i2, r3, o3 = this;
-        return qC(this, function(s3) {
-          switch (s3.label) {
+        var n2, i2, r3, o3, s3 = this;
+        return qC(this, function(a2) {
+          switch (a2.label) {
             case 0:
               if (this.isReleasing)
                 return [2, KC(function() {
-                  return !o3.isReleasing;
+                  return !s3.isReleasing;
                 }, 6e4)];
-              for (n2 in this.isReleasing = true, this.player = this.initPlayer(this.config), this.player.view && (this.frame.appendChild(this.player.view), this.player.view.style.visibility = "hidden"), e4 = this.__slideState, this.__slideState = Object(l.cloneDeep)(QC), e4.mediaState)
-                (i2 = e4.mediaState[n2]).type === "play" && (r3 = Math.max((t4 = i2.frozenTime) !== null && t4 !== void 0 ? t4 : 0, i2.time), i2.time = this.timestamp() - (r3 - i2.time), i2.frozenTime = void 0);
-              return [4, this.setSlideState(e4)];
+              for (i2 in this.isReleasing = true, this.player = this.initPlayer(this.config), ((t4 = this.config) === null || t4 === void 0 ? void 0 : t4.controller) && this.createController(), this.player.view && (this.frame.appendChild(this.player.view), this.player.view.style.visibility = "hidden"), n2 = this.__slideState, this.__slideState = Object(l.cloneDeep)(QC), n2.mediaState)
+                (r3 = n2.mediaState[i2]).type === "play" && (o3 = Math.max((e4 = r3.frozenTime) !== null && e4 !== void 0 ? e4 : 0, r3.time), r3.time = this.timestamp() - (o3 - r3.time), r3.frozenTime = void 0);
+              return [4, this.setSlideState(n2)];
             case 1:
-              return s3.sent(), [4, this.player.clock.delay(333)];
+              return a2.sent(), [4, this.player.clock.delay(333)];
             case 2:
-              s3.sent(), this.player.view && (this.player.view.style.visibility = "visible");
+              a2.sent(), this.player.view && (this.player.view.style.visibility = "visible");
               try {
                 this.frame.removeChild(this.cacheImage);
               } catch (t5) {
@@ -36287,7 +36177,7 @@ void main(void){
       this.playerController && this.playerController.destroy(), this.frameResizeObserver.disconnect(), (t4 = this.player) === null || t4 === void 0 || t4.removeAllListeners(), (e4 = this.player) === null || e4 === void 0 || e4.destroy(), (n2 = this.player) === null || n2 === void 0 || n2.removeAllListeners(), window.removeEventListener("__slide_log__", this.handleLogDownload), window.removeEventListener("__slide_state__", this.handleSlideStateLog), window.removeEventListener("__slide_ref__", this.handleSlideRef), window.clearInterval(this.persistLogId), YC && YC.removeItem(this.logId).catch(function() {
       });
       try {
-        ((i2 = this.player) === null || i2 === void 0 ? void 0 : i2.view) && this.anchor.removeChild(this.player.view);
+        ((i2 = this.player) === null || i2 === void 0 ? void 0 : i2.view) && this.anchor.removeChild(this.player.view), this.anchor.removeChild(this.frame);
       } catch (t5) {
       }
     }, e3.disposeLocalCache = function() {
@@ -36295,6 +36185,15 @@ void main(void){
     }, e3;
   }(a.a);
 }]);
+function clamp$1(value, min, max) {
+  return Math.min(Math.max(value, min), max);
+}
+function isObj(obj) {
+  return typeof obj === "object" && obj !== null;
+}
+function deepClone(obj) {
+  return JSON.parse(JSON.stringify(obj));
+}
 var colorString = { exports: {} };
 var colorName = {
   "aliceblue": [240, 248, 255],
@@ -36652,6 +36551,41 @@ function hexDouble(num) {
   return str.length < 2 ? "0" + str : str;
 }
 var ColorString = colorString.exports;
+class Logger {
+  constructor(enable) {
+    this.enable = enable;
+    this.apps = {};
+    this.level = "debug";
+    this._onMessage = (ev) => {
+      if (isObj(ev.data)) {
+        if (typeof ev.data.slide === "boolean") {
+          this.enable = ev.data.slide;
+        } else if (ev.data.slide === "__instance") {
+          console.log(this);
+        }
+      }
+    };
+    window.addEventListener("message", this._onMessage);
+  }
+  log(...args) {
+    if (this.enable) {
+      console.log(...args);
+    }
+  }
+  verbose(...args) {
+    if (this.enable && this.level === "verbose") {
+      console.log(...args);
+    }
+  }
+  dispose(appId) {
+    this.enable = false;
+    delete this.apps[appId];
+    window.removeEventListener("message", this._onMessage);
+  }
+}
+const logger = new Logger(false);
+const log = logger.log.bind(logger);
+const verbose = logger.verbose.bind(logger);
 function guessBgColor(el) {
   try {
     const bg = window.getComputedStyle(el).backgroundColor;
@@ -36748,29 +36682,21 @@ class SlideController {
           payload: event
         };
         log("[Slide] dispatch", event);
-        this.room.dispatchMagixEvent(this.channel, payload);
+        this.context.dispatchMagixEvent(Slide.SLIDE_EVENTS.syncDispatch, payload);
       }
     };
     this.magixEventListener = (ev) => {
-      if (ev.event === this.channel && isObj(ev.payload)) {
-        const { type, payload } = ev.payload;
-        if (type === Slide.SLIDE_EVENTS.syncDispatch) {
-          this.syncStateOnce();
-          log("[Slide] receive", payload);
-          this.slide.emit(Slide.SLIDE_EVENTS.syncReceive, payload);
-        }
+      const { type, payload } = ev.payload;
+      if (type === Slide.SLIDE_EVENTS.syncDispatch) {
+        this.syncStateOnce();
+        log("[Slide] receive", payload);
+        this.slide.emit(Slide.SLIDE_EVENTS.syncReceive, payload);
       }
     };
     this.onStateChange = (state) => {
       if (this.context.getIsWritable()) {
         verbose("[Slide] state change", JSON.stringify(state, null, 2));
-        this.context.updateAttributes(["state"], state);
-      }
-    };
-    this.onSeeked = () => {
-      const state = this.context.getAttributes().state;
-      if (state) {
-        this.slide.setSlideState(deepClone(state));
+        this.context.storage.setState({ state });
       }
     };
     this.pollCount = 0;
@@ -36835,7 +36761,6 @@ class SlideController {
     this.onTransitionEnd = onTransitionEnd;
     this.onError = onError;
     this.context = context;
-    this.channel = `channel-${context.appId}`;
     this.room = context.getRoom();
     this.player = this.room ? void 0 : context.getDisplayer();
     this.slide = this.createSlide(anchor);
@@ -36875,17 +36800,9 @@ class SlideController {
       });
       return disposer;
     });
-    this.sideEffect.add(() => {
-      context.emitter.on("seek", this.onSeeked);
-      return () => context.emitter.off("seek", this.onSeeked);
-    });
-    this.sideEffect.add(() => {
-      const displayer = context.getDisplayer();
-      displayer.addMagixEventListener(this.channel, this.magixEventListener, {
-        fireSelfEventAfterCommit: true
-      });
-      return () => displayer.removeMagixEventListener(this.channel);
-    });
+    this.sideEffect.add(() => context.addMagixEventListener(Slide.SLIDE_EVENTS.syncDispatch, this.magixEventListener, {
+      fireSelfEventAfterCommit: true
+    }));
     slide.on(Slide.SLIDE_EVENTS.slideChange, this.onPageChanged);
     slide.on(Slide.SLIDE_EVENTS.renderStart, this.onTransitionStart);
     slide.on(Slide.SLIDE_EVENTS.renderEnd, this.onTransitionEnd);
@@ -36898,7 +36815,7 @@ class SlideController {
   }
   syncStateOnce() {
     if (this.syncStateOnceFlag) {
-      const { state } = __spreadValues(__spreadValues({}, EmptyAttributes), this.context.getAttributes());
+      const { state } = __spreadValues(__spreadValues({}, EmptyAttributes), this.context.storage.state);
       if (state) {
         log("[Slide] sync with state (once)", deepClone(state));
         this.slide.setSlideState(deepClone(state));
@@ -37916,7 +37833,7 @@ class DocsViewer {
     return `${this.namespace}-${className}`;
   }
 }
-const ClickThroughAppliances = new Set(["clicker"]);
+const ClickThroughAppliances = /* @__PURE__ */ new Set(["clicker"]);
 class SlideDocsViewer {
   constructor({ box, view, mountSlideController, mountWhiteboard }) {
     this.slideController = null;
@@ -38060,6 +37977,55 @@ class SlideDocsViewer {
     return `${this.namespace}-${className}`;
   }
 }
+let useFreezer = false;
+const FreezerLength = 2;
+const apps = {
+  map: /* @__PURE__ */ new Map(),
+  queue: [],
+  validateQueue() {
+    log("[Slide] freezer: validate", this.queue);
+    while (this.queue.length > FreezerLength) {
+      const appId = this.queue.pop();
+      const slide = this.map.get(appId);
+      if (slide) {
+        log("[Slide] freezer: validate-freeze", appId, this.queue);
+        slide.freeze();
+      }
+    }
+  },
+  set(appId, slide) {
+    log("[Slide] freezer: add", appId, this.queue);
+    this.map.set(appId, slide);
+    if (!this.queue.includes(appId)) {
+      this.queue.unshift(appId);
+    }
+    this.validateQueue();
+  },
+  delete(appId) {
+    log("[Slide] freezer: delete", appId, this.queue);
+    this.map.delete(appId);
+    this.queue = this.queue.filter((id) => id !== appId);
+  },
+  focus(appId) {
+    const slide = this.map.get(appId);
+    const index = this.queue.indexOf(appId);
+    if (index > -1) {
+      this.queue.splice(index, 1);
+    }
+    this.queue.unshift(appId);
+    this.validateQueue();
+    log("[Slide] freezer: focus", appId, this.queue);
+    if (slide) {
+      slide.unfreeze();
+    }
+  }
+};
+const addHooks = (emitter) => {
+  useFreezer = true;
+  emitter.on("focus", ({ appId }) => {
+    apps.focus(appId);
+  });
+};
 var styles = ".netless-app-slide-content{position:relative;height:100%;overflow:hidden}.netless-app-slide-preview-mask{display:none;position:absolute;z-index:200;top:0;left:0;width:100%;height:100%}.netless-app-slide-preview{display:flex;flex-direction:column;align-items:center;position:absolute;z-index:300;top:0;left:0;width:33%;max-width:200px;height:100%;padding-top:10px;transform:translate(-100%);background:rgba(237,237,240,.9);box-shadow:inset -1px 0 #0000001c;transition:transform .4s}.netless-app-slide-preview-active .netless-app-slide-preview-mask{display:block}.netless-app-slide-preview-active .netless-app-slide-preview{transform:translate(0)}.netless-app-slide-preview-page{position:relative;display:block;width:55%;margin-bottom:10px;font-size:0;color:transparent;outline:none;border:7px solid transparent;border-radius:4px;transition:border-color .3s;user-select:none}.netless-app-slide-preview-page:hover,.netless-app-slide-preview-page.netless-app-slide-preview-page-active{border-color:#444e601a}.netless-app-slide-preview-page>img{width:100%;height:auto;box-sizing:border-box;border:1px solid rgba(0,0,0,.5);border-radius:1px;background-color:#fff;box-shadow:0 2px 8px #0000004d}.netless-app-slide-preview-page-name{position:absolute;top:1px;left:-10px;transform:translate(-100%);text-align:right;font-size:12px;color:#5f5f5f;user-select:none}.netless-app-slide-footer{box-sizing:border-box;height:26px;display:flex;align-items:center;padding:0 16px;border-top:1px solid #eeeef7;color:#191919}.netless-app-slide-float-footer{width:100%;min-height:26px;position:absolute;left:0;bottom:0;z-index:2000;background:rgba(249,249,252,.9);transition:opacity .4s}.netless-app-slide-footer-btn{box-sizing:border-box;width:26px;height:26px;font-size:0;margin:0;padding:3px;border:none;border-radius:1px;outline:none;color:currentColor;background:transparent;transition:background .4s;cursor:pointer;user-select:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.netless-app-slide-footer-btn:hover{background:rgba(237,237,240,.9)}@media (hover: none){.netless-app-slide-footer-btn:hover{background:transparent!important}}.netless-app-slide-footer-btn>svg{width:100%;height:100%}.netless-app-slide-footer-btn>svg:nth-of-type(2){display:none}.netless-app-slide-footer-btn.netless-app-slide-footer-btn-playing>svg:nth-of-type(1){display:none}.netless-app-slide-footer-btn.netless-app-slide-footer-btn-playing>svg:nth-of-type(2){display:initial}.netless-app-slide-footer-btn~.netless-app-slide-footer-btn{margin-left:15px}.netless-app-slide-page-jumps{flex:1;display:flex;justify-content:center;align-items:center}.netless-app-slide-page-number{margin-left:auto;font-size:13px;user-select:none;white-space:nowrap;word-break:keep-all}.netless-app-slide-page-number-input{border:none;outline:none;width:3em;margin:0;padding:0 2px;text-align:right;font-size:13px;line-height:1;font-weight:400;font-family:inherit;border-radius:2px;color:currentColor;background:transparent;transition:background .4s;user-select:text;-webkit-tap-highlight-color:rgba(0,0,0,0)}.netless-app-slide-page-number-input:hover,.netless-app-slide-page-number-input:focus,.netless-app-slide-page-number-input:active{background:#fff;box-shadow:#63636333 0 2px 8px}.netless-app-slide-readonly.netless-app-slide-footer{display:none}.telebox-color-scheme-dark .netless-app-slide-page-number-input{color:#a6a6a8}.telebox-color-scheme-dark .netless-app-slide-page-number-input:active,.telebox-color-scheme-dark .netless-app-slide-page-number-input:focus,.telebox-color-scheme-dark .netless-app-slide-page-number-input:hover{color:#222}.telebox-color-scheme-dark .netless-app-slide-footer{color:#a6a6a8;background:#2d2d33;border-top:none}.telebox-color-scheme-dark .netless-app-slide-footer-btn:hover{background:#212126}.telebox-color-scheme-dark .netless-app-slide-preview{background:rgba(50,50,50,.9)}.netless-app-slide-wb-view{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;overflow:hidden}.netless-app-slide-slide{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.netless-app-slide-slide canvas{transform:scale(var(--netless-app-slide-scale, 1))}\n";
 function previewSlide({
   container,
@@ -38217,16 +38183,15 @@ class SlidePreviewer {
     return `${this.namespace}-${className}`;
   }
 }
-const version = "0.0.56";
+const version = "0.1.0";
 const SlideApp = {
   kind: "Slide",
   setup(context) {
     console.log("[Slide] setup @ " + version);
     if (context.getIsWritable()) {
-      ensureAttributes(context, EmptyAttributes);
+      context.storage.ensureState(EmptyAttributes);
     }
-    const attributes = context.getAttributes();
-    if (!(attributes == null ? void 0 : attributes.taskId)) {
+    if (!context.storage.state.taskId) {
       throw new Error("[Slide] no taskId");
     }
     const view = context.getView();
@@ -38313,6 +38278,56 @@ const SlideApp = {
       }
     });
     docsViewer.mount();
+    return {
+      slide: () => {
+        var _a;
+        return (_a = docsViewer == null ? void 0 : docsViewer.slideController) == null ? void 0 : _a.slide;
+      },
+      nextStep: () => {
+        var _a;
+        if (docsViewer && docsViewer.slideController) {
+          (_a = docsViewer == null ? void 0 : docsViewer.slideController) == null ? void 0 : _a.slide.nextStep();
+          return true;
+        }
+        return false;
+      },
+      prevStep: () => {
+        var _a;
+        if (docsViewer && docsViewer.slideController) {
+          (_a = docsViewer == null ? void 0 : docsViewer.slideController) == null ? void 0 : _a.slide.prevStep();
+          return true;
+        }
+        return false;
+      },
+      position: () => {
+        const controller = docsViewer == null ? void 0 : docsViewer.slideController;
+        if (controller) {
+          return [controller.page, controller.pageCount];
+        }
+      },
+      nextPage: () => {
+        const controller = docsViewer == null ? void 0 : docsViewer.slideController;
+        if (controller) {
+          const { page, pageCount } = controller;
+          if (pageCount > 0 && page < pageCount) {
+            controller.jumpToPage(page + 1);
+            return true;
+          }
+        }
+        return false;
+      },
+      prevPage: () => {
+        const controller = docsViewer == null ? void 0 : docsViewer.slideController;
+        if (controller) {
+          const { page, pageCount } = controller;
+          if (pageCount > 0 && page > 1) {
+            controller.jumpToPage(page - 1);
+            return true;
+          }
+        }
+        return false;
+      }
+    };
   }
 };
 export { DefaultUrl, FreezerLength, SlidePreviewer, addHooks, apps, SlideApp as default, previewSlide, version };