@visactor/vrender 1.1.0-alpha.22 → 1.1.0-alpha.23

package/dist/index.js

@@ -169,7 +169,7 @@
       }
     }
 
-    var __awaiter$a = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$8 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -338,7 +338,7 @@
         return this._env || this.setEnv("browser"), this.envContribution.loadBlob(url);
       }
       loadFont(name, source, descriptors) {
-        return __awaiter$a(this, void 0, void 0, function* () {
+        return __awaiter$8(this, void 0, void 0, function* () {
           return this._env || this.setEnv("browser"), this.envContribution.loadFont(name, source, descriptors);
         });
       }
@@ -2668,7 +2668,7 @@
     };
     const lowerCamelCaseToMiddle = str => str.replace(/([A-Z])/g, "-$1").toLowerCase();
 
-    var __awaiter$9 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$7 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -2736,7 +2736,7 @@
         }
       }
       forEachChildrenAsync(cb, reverse = !1) {
-        return __awaiter$9(this, void 0, void 0, function* () {
+        return __awaiter$7(this, void 0, void 0, function* () {
           if (reverse) {
             let child = this._lastChild,
               i = 0;
@@ -6292,7 +6292,7 @@
       return str.startsWith("<");
     }
 
-    var __awaiter$8 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$6 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -6321,7 +6321,7 @@
       group.incrementalAppendChild(graphic);
     }
     function waitForAllSubLayers(stage) {
-      return __awaiter$8(this, void 0, void 0, function* () {
+      return __awaiter$6(this, void 0, void 0, function* () {
         const promiseList = [],
           layers = stage.getChildren();
         yield new Promise(resolve => {
@@ -14304,7 +14304,7 @@
       }
     }
 
-    var __awaiter$7 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$5 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -14374,7 +14374,7 @@
       } else graphic.forEachChildren(cb, reverse);
     }
     function foreachAsync(graphic, defaultZIndex, cb, reverse = !1) {
-      return __awaiter$7(this, void 0, void 0, function* () {
+      return __awaiter$5(this, void 0, void 0, function* () {
         yield graphic.forEachChildrenAsync(cb, reverse);
       });
     }
@@ -15261,7 +15261,7 @@
       return isBrowserEnv() ? "browser" : "node";
     }
 
-    var __awaiter$6 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$4 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -15458,7 +15458,7 @@
       }
       runJob(job) {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j;
-        return __awaiter$6(this, void 0, void 0, function* () {
+        return __awaiter$4(this, void 0, void 0, function* () {
           if ("cancelled" === job.status) return;
           if (yield this.waitForNextFrame(), "cancelled" === job.status) return;
           job.status = "running", null === (_a = this.perfMonitor) || void 0 === _a || _a.recordEvent("deferred-job-start", {
@@ -17943,7 +17943,7 @@
     }
 
     var STATUS,
-      __awaiter$5 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+      __awaiter$3 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
         return new (P || (P = Promise))(function (resolve, reject) {
           function fulfilled(value) {
             try {
@@ -17978,7 +17978,7 @@
         }, this.defaultRenderMap.set(this.lineRender.numberType, this.lineRender), this.defaultRenderMap.set(this.areaRender.numberType, this.areaRender);
       }
       draw(renderService, drawContext) {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           if (this.checkingForDrawPromise) return;
           this.lastRenderService = renderService, this.lastDrawContext = drawContext, this.checkingForDrawPromise = this.checkForDraw(drawContext);
           const skipDraw = yield this.checkingForDrawPromise;
@@ -17999,15 +17999,15 @@
         });
       }
       _increaseRender(group, drawContext) {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           this.rendering = !0, yield this._renderIncrementalGroup(group, drawContext);
         });
       }
       _renderIncrementalGroup(group, drawContext) {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           this.count = group.count, yield new Promise(resolve => {
             this.renderItem(group, drawContext, {
-              drawingCb: () => __awaiter$5(this, void 0, void 0, function* () {
+              drawingCb: () => __awaiter$3(this, void 0, void 0, function* () {
                 if (2 !== group.count) yield foreachAsync(group, DefaultAttribute.zIndex, (item, i) => {
                   if (this.status === STATUS.STOP) return !0;
                   if (item.isContainer) return !1;
@@ -18028,7 +18028,7 @@
         });
       }
       waitToNextFrame() {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           return new Promise(resolve => {
             this.global.getRequestAnimationFrame()(() => {
               resolve(!1);
@@ -18037,13 +18037,13 @@
         });
       }
       checkForDraw(drawContext) {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           let skip = this.rendering;
           return drawContext.restartIncremental && (skip = !1, yield this.forceStop(), this.resetToInit()), skip;
         });
       }
       forceStop() {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           this.rendering && (this.status = STATUS.STOP, yield new Promise(resolve => {
             this.hooks.completeDraw.tap("stopCb", () => {
               this.status = STATUS.NORMAL, this.hooks.completeDraw.taps = this.hooks.completeDraw.taps.filter(item => "stopCb" !== item.name), resolve(!1);
@@ -18055,11 +18055,11 @@
         this.currFrameStartAt = 0, this.currentIdx = 0;
       }
       renderGroup(group, drawContext) {
-        return __awaiter$5(this, void 0, void 0, function* () {
+        return __awaiter$3(this, void 0, void 0, function* () {
           if (!drawContext.break && !1 !== group.attribute.visibleAll) return group.incremental && drawContext.startAtId === group._uid ? (yield this._increaseRender(group, drawContext), void (drawContext.break = !0)) : void (yield new Promise(resolve => {
             this.renderItem(group, drawContext, {
-              drawingCb: () => __awaiter$5(this, void 0, void 0, function* () {
-                yield foreachAsync(group, DefaultAttribute.zIndex, item => __awaiter$5(this, void 0, void 0, function* () {
+              drawingCb: () => __awaiter$3(this, void 0, void 0, function* () {
+                yield foreachAsync(group, DefaultAttribute.zIndex, item => __awaiter$3(this, void 0, void 0, function* () {
                   drawContext.break || item.isContainer && (yield this.renderGroup(item, drawContext));
                 })), resolve(!1);
               })
@@ -19937,7 +19937,7 @@
       }
     }
 
-    var __awaiter$4 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$2 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -20031,7 +20031,7 @@
         };
       }
       loadFont(font, source, descriptors) {
-        return __awaiter$4(this, void 0, void 0, function* () {
+        return __awaiter$2(this, void 0, void 0, function* () {
           return {
             loadState: "fail"
           };
@@ -27097,7 +27097,9 @@
       init() {
         this._context = new HarmonyContext2d(this, this._dpr);
       }
-      resize(width, height) {}
+      resize(width, height) {
+        this.controled && (this._pixelWidth = width * this._dpr, this._pixelHeight = height * this._dpr, this._displayWidth = width, this._displayHeight = height, this._nativeCanvas.width = this._pixelWidth, this._nativeCanvas.height = this._pixelHeight, this._context.dpr = this._dpr);
+      }
       release(...params) {}
     }
     HarmonyCanvas.env = "harmony";
@@ -28028,7 +28030,7 @@
       (null === (_a = container.isBound) || void 0 === _a ? void 0 : _a.call(container, BrowserWindowHandlerContribution)) || container.bind(BrowserWindowHandlerContribution).toSelf(), (null === (_b = container.getNamed) || void 0 === _b ? void 0 : _b.call(container, WindowHandlerContribution, BrowserWindowHandlerContribution.env)) || container.bind(WindowHandlerContribution).toService(BrowserWindowHandlerContribution).whenTargetNamed(BrowserWindowHandlerContribution.env);
     }
 
-    var __awaiter$3 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
+    var __awaiter$1 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
       return new (P || (P = Promise))(function (resolve, reject) {
         function fulfilled(value) {
           try {
@@ -28247,7 +28249,7 @@
         };
       }
       loadFont(font, source, descriptors) {
-        return __awaiter$3(this, void 0, void 0, function* () {
+        return __awaiter$1(this, void 0, void 0, function* () {
           return new FontFace(font, isString$1(source) ? `url(${source})` : source, descriptors).load().then(function (loadedFont) {
             return document.fonts.add(loadedFont), {
               loadState: "success"
@@ -28346,7 +28348,12 @@
       createWindowByCanvas(params) {
         let canvas;
         if ("string" == typeof params.canvas) {
-          if (canvas = this.global.getElementById(params.canvas), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
+          if (canvas = this.global.getElementById(params.canvas), canvas || (canvas = this.global.createCanvas({
+            id: params.canvas,
+            width: params.width,
+            height: params.height,
+            dpr: params.dpr
+          })), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
         } else canvas = params.canvas;
         let width = params.width,
           height = params.height;
@@ -28673,17 +28680,55 @@
       }
     }
 
-    function makeUpCanvas$4(domref, canvasIdLists, canvasMap, freeCanvasIdx, freeCanvasList, pixelRatio) {
-      const dpr = null != pixelRatio ? pixelRatio : tt.getSystemInfoSync().pixelRatio;
-      canvasIdLists.forEach((id, i) => {
-        const ctx = tt.createCanvasContext(id),
-          canvas = new CanvasWrapDisableWH(ctx.canvas || {}, ctx, dpr, domref.width, domref.height, id);
-        ctx.canvas = canvas, canvasMap.set(id, canvas), i >= freeCanvasIdx && freeCanvasList.push(canvas);
-      });
+    function getMiniAppCanvasOptions(params, pixelRatio, offscreen = null == params.id) {
+      var _a, _b, _c;
+      return {
+        id: null == params.id ? void 0 : String(params.id),
+        width: null !== (_a = params.width) && void 0 !== _a ? _a : 0,
+        height: null !== (_b = params.height) && void 0 !== _b ? _b : 0,
+        dpr: null !== (_c = params.dpr) && void 0 !== _c ? _c : pixelRatio,
+        offscreen: offscreen
+      };
+    }
+    function wrapMiniAppNativeCanvas(nativeCanvas, options) {
+      var _a;
+      const ctx = null === (_a = null == nativeCanvas ? void 0 : nativeCanvas.getContext) || void 0 === _a ? void 0 : _a.call(nativeCanvas, "2d");
+      if (!ctx) throw new Error('MiniApp canvas bridge returned a canvas without getContext("2d").');
+      return new CanvasWrapEnableWH(nativeCanvas, ctx, options.dpr, options.width, options.height, options.id);
+    }
+    function wrapMiniAppContextCanvas(ctx, options) {
+      if (!ctx) throw new Error("MiniApp canvas bridge returned an empty 2d context.");
+      const canvas = new CanvasWrapDisableWH(ctx.canvas || {}, ctx, options.dpr, options.width, options.height, options.id);
+      return ctx.canvas = canvas, canvas;
+    }
+    function createCanvasWithFactory(params, pixelRatio, canvasMap, factory) {
+      const options = getMiniAppCanvasOptions(params, pixelRatio),
+        id = options.id;
+      if (null != id) {
+        const existing = canvasMap.get(id);
+        if (existing) return existing;
+      }
+      if (!factory) return null;
+      const canvas = wrapMiniAppNativeCanvas(factory(options), options);
+      return null != id && canvasMap.set(id, canvas), canvas;
+    }
+
+    const FEISHU_CANVAS_BRIDGE_ERROR = "Feishu canvas bridge is unavailable. VRender feishu env requires envParams.canvasFactory, a Stage canvas object, or a feishu/tt runtime that exposes createCanvasContext(id).";
+    function getFeishuRuntime(params) {
+      var _a, _b, _c, _d, _e;
+      try {
+        return null !== (_c = null !== (_b = null !== (_a = null == params ? void 0 : params.feishu) && void 0 !== _a ? _a : null == params ? void 0 : params.tt) && void 0 !== _b ? _b : null == params ? void 0 : params.runtime) && void 0 !== _c ? _c : "undefined" != typeof tt ? tt : void 0;
+      } catch (_f) {
+        return null !== (_e = null !== (_d = null == params ? void 0 : params.feishu) && void 0 !== _d ? _d : null == params ? void 0 : params.tt) && void 0 !== _e ? _e : null == params ? void 0 : params.runtime;
+      }
+    }
+    function getFeishuPixelRatio(params, runtime = getFeishuRuntime(params)) {
+      var _a, _b, _c, _d;
+      return null !== (_d = null !== (_a = null == params ? void 0 : params.pixelRatio) && void 0 !== _a ? _a : null === (_c = null === (_b = null == runtime ? void 0 : runtime.getSystemInfoSync) || void 0 === _b ? void 0 : _b.call(runtime)) || void 0 === _c ? void 0 : _c.pixelRatio) && void 0 !== _d ? _d : 1;
     }
     class FeishuEnvContribution extends BaseEnvContribution {
       constructor() {
-        super(), this.type = "feishu", this.supportEvent = !0, this.canvasMap = new Map(), this.freeCanvasList = [], this.canvasIdx = 0, this.supportsTouchEvents = !0;
+        super(), this.type = "feishu", this.supportEvent = !0, this.canvasMap = new Map(), this.feishuEnvParams = {}, this.supportsTouchEvents = !0;
         try {
           this.supportsPointerEvents = !!globalThis.PointerEvent, this.supportsMouseEvents = !!globalThis.MouseEvent;
         } catch (err) {
@@ -28692,13 +28737,13 @@
         this.applyStyles = !0;
       }
       getDynamicCanvasCount() {
-        return this.freeCanvasList.length;
+        return 0;
       }
       getStaticCanvasCount() {
         return 9999;
       }
-      configure(service, params) {
-        service.env === this.type && (service.setActiveEnvContribution(this), makeUpCanvas$4(params.domref, params.canvasIdLists, this.canvasMap, params.freeCanvasIdx, this.freeCanvasList, params.pixelRatio));
+      configure(service, params = {}) {
+        service.env === this.type && (service.setActiveEnvContribution(this), this.feishuEnvParams = params);
       }
       loadImage(url) {
         return Promise.resolve({
@@ -28710,13 +28755,21 @@
         return Promise.reject();
       }
       createCanvas(params) {
-        const result = this.freeCanvasList[this.canvasIdx] || this.freeCanvasList[this.freeCanvasList.length - 1];
-        return this.canvasIdx++, result;
+        var _a;
+        const envParams = this.feishuEnvParams,
+          runtime = getFeishuRuntime(envParams),
+          dpr = null !== (_a = params.dpr) && void 0 !== _a ? _a : getFeishuPixelRatio(envParams, runtime),
+          factoryCanvas = createCanvasWithFactory(params, dpr, this.canvasMap, envParams.canvasFactory);
+        if (factoryCanvas) return factoryCanvas;
+        const options = getMiniAppCanvasOptions(params, dpr, !1);
+        if (null == options.id || "function" != typeof (null == runtime ? void 0 : runtime.createCanvasContext)) throw new Error(FEISHU_CANVAS_BRIDGE_ERROR);
+        const canvas = wrapMiniAppContextCanvas(runtime.createCanvasContext(options.id), options);
+        return this.canvasMap.set(options.id, canvas), canvas;
       }
       createOffscreenCanvas(params) {}
       releaseCanvas(canvas) {}
       getDevicePixelRatio() {
-        return tt.getSystemInfoSync().pixelRatio;
+        return getFeishuPixelRatio(this.feishuEnvParams);
       }
       getRequestAnimationFrame() {
         return function (callback) {
@@ -28784,6 +28837,40 @@
         this.cache = {};
       }
     };
+    function setMiniAppEventTarget$2(event, key, value) {
+      if (event && value) try {
+        event[key] = value;
+      } catch (_a) {
+        Object.defineProperty(event, key, {
+          configurable: !0,
+          value: value
+        });
+      }
+    }
+    function isValidCoordinate$3(value) {
+      return "number" == typeof value && Number.isFinite(value);
+    }
+    function pickCoordinate$3(...values) {
+      for (let i = 0; i < values.length; i++) if (isValidCoordinate$3(values[i])) return values[i];
+    }
+    function setHarmonyEventValue(event, key, value) {
+      try {
+        event[key] = value;
+      } catch (_a) {
+        Object.defineProperty(event, key, {
+          configurable: !0,
+          value: value
+        });
+      }
+    }
+    function normalizeHarmonyTouchEventPoint(event) {
+      var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+      const touch = null !== (_b = null === (_a = null == event ? void 0 : event.changedTouches) || void 0 === _a ? void 0 : _a[0]) && void 0 !== _b ? _b : null === (_c = null == event ? void 0 : event.touches) || void 0 === _c ? void 0 : _c[0];
+      if (!touch) return;
+      const x = pickCoordinate$3(event.x, event.offsetX, event.clientX, event.pageX, touch.x, touch.offsetX, touch.clientX, touch.pageX),
+        y = pickCoordinate$3(event.y, event.offsetY, event.clientY, event.pageY, touch.y, touch.offsetY, touch.clientY, touch.pageY);
+      null != x && null != y && (!event.touches && event.changedTouches && setHarmonyEventValue(event, "touches", "touchend" === event.type || "touchcancel" === event.type ? [] : event.changedTouches), setHarmonyEventValue(event, "x", x), setHarmonyEventValue(event, "y", y), setHarmonyEventValue(event, "offsetX", null !== (_d = event.offsetX) && void 0 !== _d ? _d : x), setHarmonyEventValue(event, "offsetY", null !== (_e = event.offsetY) && void 0 !== _e ? _e : y), setHarmonyEventValue(event, "clientX", null !== (_f = event.clientX) && void 0 !== _f ? _f : x), setHarmonyEventValue(event, "clientY", null !== (_g = event.clientY) && void 0 !== _g ? _g : y), setHarmonyEventValue(event, "pageX", null !== (_h = event.pageX) && void 0 !== _h ? _h : x), setHarmonyEventValue(event, "pageY", null !== (_j = event.pageY) && void 0 !== _j ? _j : y), touch.x = null !== (_k = touch.x) && void 0 !== _k ? _k : x, touch.y = null !== (_l = touch.y) && void 0 !== _l ? _l : y, touch.offsetX = null !== (_m = touch.offsetX) && void 0 !== _m ? _m : x, touch.offsetY = null !== (_o = touch.offsetY) && void 0 !== _o ? _o : y, touch.clientX = null !== (_p = touch.clientX) && void 0 !== _p ? _p : x, touch.clientY = null !== (_q = touch.clientY) && void 0 !== _q ? _q : y, touch.pageX = null !== (_r = touch.pageX) && void 0 !== _r ? _r : x, touch.pageY = null !== (_s = touch.pageY) && void 0 !== _s ? _s : y);
+    }
     class HarmonyWindowHandlerContribution extends BaseWindowHandlerContribution {
       get container() {
         return null;
@@ -28812,7 +28899,8 @@
       createWindowByConfig(params) {
         const nativeCanvas = this.global.createCanvas({
             width: params.width,
-            height: params.height
+            height: params.height,
+            dpr: params.dpr
           }),
           options = {
             width: params.width,
@@ -28827,7 +28915,12 @@
       createWindowByCanvas(params) {
         let canvas;
         if ("string" == typeof params.canvas) {
-          if (canvas = this.global.getElementById(params.canvas), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
+          if (canvas = this.global.getElementById(params.canvas), canvas || (canvas = this.global.createCanvas({
+            id: params.canvas,
+            width: params.width,
+            height: params.height,
+            dpr: params.dpr
+          })), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
         } else canvas = params.canvas;
         let width = params.width,
           height = params.height;
@@ -28835,15 +28928,19 @@
           const data = canvas.getBoundingClientRect();
           width = data.width, height = data.height;
         }
-        this.canvas = new HarmonyCanvas({
+        let dpr = params.dpr;
+        null == dpr && (dpr = canvas.width / width), this.canvas = new HarmonyCanvas({
           width: width,
           height: height,
-          dpr: 1,
+          dpr: dpr,
           nativeCanvas: canvas,
           canvasControled: params.canvasControled
         });
       }
-      releaseWindow() {}
+      releaseWindow() {
+        var _a, _b;
+        this.eventManager.cleanEvent(), null === (_b = null === (_a = this.canvas) || void 0 === _a ? void 0 : _a.release) || void 0 === _b || _b.call(_a);
+      }
       resizeWindow(width, height) {
         this.canvas.resize(width, height);
       }
@@ -28866,12 +28963,15 @@
         this.eventManager.removeEventListener(type, listener);
       }
       dispatchEvent(event) {
+        var _a;
         const {
           type: type
         } = event;
-        return !!this.eventManager.cache[type] && (event.changedTouches && event.changedTouches[0] && (event.offsetX = event.changedTouches[0].x, event.changedTouches[0].offsetX = event.changedTouches[0].x, event.changedTouches[0].clientX = event.changedTouches[0].x, event.offsetY = event.changedTouches[0].y, event.changedTouches[0].offsetY = event.changedTouches[0].y, event.changedTouches[0].clientY = event.changedTouches[0].y), event.preventDefault = () => {}, event.stopPropagation = () => {}, this.eventManager.cache[type].listener && this.eventManager.cache[type].listener.forEach(f => {
+        if (!this.eventManager.cache[type]) return !1;
+        const nativeCanvas = null === (_a = this.canvas) || void 0 === _a ? void 0 : _a.nativeCanvas;
+        return setMiniAppEventTarget$2(event, "target", nativeCanvas), setMiniAppEventTarget$2(event, "currentTarget", nativeCanvas), normalizeHarmonyTouchEventPoint(event), event.preventDefault = () => {}, event.stopPropagation = () => {}, this.eventManager.cache[type].listener && this.eventManager.cache[type].listener.forEach(f => {
           f(event);
-        }), !0);
+        }), !0;
       }
       getStyle() {
         return {};
@@ -28903,24 +29003,89 @@
       (null === (_a = container.isBound) || void 0 === _a ? void 0 : _a.call(container, HarmonyWindowHandlerContribution)) || container.bind(HarmonyWindowHandlerContribution).toSelf(), (null === (_b = container.getNamed) || void 0 === _b ? void 0 : _b.call(container, WindowHandlerContribution, HarmonyWindowHandlerContribution.env)) || container.bind(WindowHandlerContribution).toService(HarmonyWindowHandlerContribution).whenTargetNamed(HarmonyWindowHandlerContribution.env);
     }
 
-    function createCanvas(width, height, id) {
-      const _c = new OffscreenCanvas(width, height),
-        context = _c.getContext("2d");
-      return new CanvasWrapDisableWH({
+    const HARMONY_CANVAS_BRIDGE_ERROR = "Harmony canvas bridge is unavailable. VRender Harmony env requires envParams.canvasFactory or a Harmony runtime that exposes a global createCanvas/createOffscreenCanvas capability.",
+      HARMONY_CANVAS_SIZE_ERROR = "Harmony canvas size is unavailable. Pass stage width/height when creating a Harmony stage canvas.";
+    function isValidCoordinate$2(value) {
+      return "number" == typeof value && Number.isFinite(value);
+    }
+    function pickCoordinate$2(...values) {
+      for (let i = 0; i < values.length; i++) if (isValidCoordinate$2(values[i])) return values[i];
+    }
+    function getPrimaryTouch$1(event) {
+      var _a, _b, _c;
+      return null !== (_b = null === (_a = null == event ? void 0 : event.changedTouches) || void 0 === _a ? void 0 : _a[0]) && void 0 !== _b ? _b : null === (_c = null == event ? void 0 : event.touches) || void 0 === _c ? void 0 : _c[0];
+    }
+    function getHarmonyEventPoint(event) {
+      const touch = getPrimaryTouch$1(event),
+        x = pickCoordinate$2(null == event ? void 0 : event.x, null == event ? void 0 : event.offsetX, null == event ? void 0 : event.clientX, null == event ? void 0 : event.pageX, null == touch ? void 0 : touch.x, null == touch ? void 0 : touch.offsetX, null == touch ? void 0 : touch.clientX, null == touch ? void 0 : touch.pageX),
+        y = pickCoordinate$2(null == event ? void 0 : event.y, null == event ? void 0 : event.offsetY, null == event ? void 0 : event.clientY, null == event ? void 0 : event.pageY, null == touch ? void 0 : touch.y, null == touch ? void 0 : touch.offsetY, null == touch ? void 0 : touch.clientY, null == touch ? void 0 : touch.pageY);
+      return null == x || null == y ? null : {
+        x: x,
+        y: y
+      };
+    }
+    function getHarmonyRuntime(params) {
+      var _a;
+      return null !== (_a = null == params ? void 0 : params.harmony) && void 0 !== _a ? _a : null == params ? void 0 : params.runtime;
+    }
+    function getHarmonyPixelRatio(params) {
+      var _a;
+      return null !== (_a = null == params ? void 0 : params.pixelRatio) && void 0 !== _a ? _a : 1;
+    }
+    function getCanvasSize$1(width, height) {
+      if (!isValidCoordinate$2(width) || !isValidCoordinate$2(height)) throw new Error(HARMONY_CANVAS_SIZE_ERROR);
+      return {
+        width: width,
+        height: height
+      };
+    }
+    function getGlobalOffscreenCanvasCtor() {
+      try {
+        return "undefined" != typeof OffscreenCanvas ? OffscreenCanvas : void 0;
+      } catch (err) {
+        return;
+      }
+    }
+    function createFallbackOffscreenCanvas(width, height) {
+      const OffscreenCanvasCtor = getGlobalOffscreenCanvasCtor();
+      return "function" != typeof OffscreenCanvasCtor ? null : new OffscreenCanvasCtor(width, height);
+    }
+    function wrapHarmonyNativeCanvas(nativeCanvas, id, width, height, dpr) {
+      var _a, _b, _c;
+      nativeCanvas.width = width * dpr, nativeCanvas.height = height * dpr;
+      const context = null !== (_b = null === (_a = nativeCanvas.getContext) || void 0 === _a ? void 0 : _a.call(nativeCanvas, "2d")) && void 0 !== _b ? _b : null === (_c = nativeCanvas.getContext) || void 0 === _c ? void 0 : _c.call(nativeCanvas);
+      if (!context) throw new Error(HARMONY_CANVAS_BRIDGE_ERROR);
+      return "function" != typeof nativeCanvas.getBoundingClientRect && (nativeCanvas.getBoundingClientRect = () => ({
+        width: width,
+        height: height
+      })), new CanvasWrapEnableWH(nativeCanvas, context, dpr, width, height, id);
+    }
+    function createHarmonyNativeCanvas(id, width, height, dpr, offscreen, params, runtime) {
+      const options = {
+        id: id,
         width: width,
         height: height,
-        context: context,
-        _c: _c,
-        getBoundingClientRect: () => ({
-          width: width,
-          height: height
-        }),
-        getContext: () => context
-      }, context, 1, width, height, id);
+        dpr: dpr,
+        offscreen: offscreen
+      };
+      if (params.canvasFactory) return params.canvasFactory(options);
+      if (offscreen && "function" == typeof (null == runtime ? void 0 : runtime.createOffscreenCanvas)) {
+        const canvas = runtime.createOffscreenCanvas(options);
+        if (canvas) return canvas;
+      }
+      if (!offscreen && "function" == typeof (null == runtime ? void 0 : runtime.createCanvas)) {
+        const canvas = runtime.createCanvas(options);
+        if (canvas) return canvas;
+      }
+      if (offscreen) {
+        const canvas = createFallbackOffscreenCanvas(width * dpr, height * dpr);
+        if (canvas) return canvas;
+      }
+      throw new Error(HARMONY_CANVAS_BRIDGE_ERROR);
     }
     class HarmonyEnvContribution extends BaseEnvContribution {
       constructor() {
-        super(), this.type = "harmony", this.supportEvent = !0, this.supportsTouchEvents = !0;
+        super(), this.type = "harmony", this.supportEvent = !0, this.canvasMap = new Map(), this.freeCanvasList = [], this.canvasIdx = 0, this.supportsTouchEvents = !0;
         try {
           this.supportsPointerEvents = !!globalThis.PointerEvent, this.supportsMouseEvents = !!globalThis.MouseEvent;
         } catch (err) {
@@ -28928,8 +29093,8 @@
         }
         this.applyStyles = !0, this.rafSTO = new RafBasedSTO(0);
       }
-      configure(service, params) {
-        service.env === this.type && service.setActiveEnvContribution(this);
+      configure(service, params = {}) {
+        service.env === this.type && (service.setActiveEnvContribution(this), this.harmonyEnvParams = params, this.harmonyRuntime = getHarmonyRuntime(params));
       }
       getDynamicCanvasCount() {
         return 9999;
@@ -28937,17 +29102,56 @@
       getStaticCanvasCount() {
         return 9999;
       }
-      loadImage(url) {}
+      loadImage(url) {
+        var _a;
+        if ("function" != typeof (null === (_a = this.harmonyRuntime) || void 0 === _a ? void 0 : _a.createImage)) return Promise.resolve({
+          data: null,
+          loadState: "fail"
+        });
+        const img = this.harmonyRuntime.createImage(url);
+        return new Promise(resolve => {
+          img.onload = () => {
+            resolve({
+              data: img,
+              loadState: "success"
+            });
+          }, img.onerror = () => {
+            resolve({
+              data: null,
+              loadState: "fail"
+            });
+          };
+        });
+      }
       loadSvg(url) {
-        return Promise.reject();
+        return Promise.resolve({
+          data: null,
+          loadState: "fail"
+        });
       }
       createCanvas(params) {
-        return createCanvas(params.width, params.height, params.id);
+        var _a, _b;
+        const envParams = null !== (_a = this.harmonyEnvParams) && void 0 !== _a ? _a : {},
+          runtime = getHarmonyRuntime(envParams),
+          dpr = null !== (_b = params.dpr) && void 0 !== _b ? _b : getHarmonyPixelRatio(envParams),
+          size = getCanvasSize$1(params.width, params.height);
+        if (null != params.id) {
+          const id = String(params.id),
+            existing = this.canvasMap.get(id);
+          if (existing) return existing;
+          const canvas = wrapHarmonyNativeCanvas(createHarmonyNativeCanvas(id, size.width, size.height, dpr, !1, envParams, runtime), id, size.width, size.height, dpr);
+          return this.canvasMap.set(id, canvas), canvas;
+        }
+        const result = this.freeCanvasList[this.canvasIdx] || this.freeCanvasList[this.freeCanvasList.length - 1];
+        if (this.canvasIdx++, result) return result;
+        const id = Math.random().toString(),
+          canvas = wrapHarmonyNativeCanvas(createHarmonyNativeCanvas(id, size.width, size.height, dpr, !0, envParams, runtime), id, size.width, size.height, dpr);
+        return this.canvasMap.set(id, canvas), this.freeCanvasList.push(canvas), canvas;
       }
       createOffscreenCanvas(params) {}
       releaseCanvas(canvas) {}
       getDevicePixelRatio() {
-        return 1;
+        return getHarmonyPixelRatio(this.harmonyEnvParams);
       }
       getRequestAnimationFrame() {
         return callback => this.rafSTO.call(callback);
@@ -28959,7 +29163,7 @@
       }
       mapToCanvasPoint(event) {
         var _a;
-        return null === (_a = null == event ? void 0 : event.type) || void 0 === _a || _a.startsWith("mouse"), event;
+        return null !== (_a = getHarmonyEventPoint(event)) && void 0 !== _a ? _a : event;
       }
       addEventListener(type, listener, options) {
         return null;
@@ -28971,7 +29175,8 @@
         return null;
       }
       getElementById(str) {
-        return null;
+        var _a;
+        return null !== (_a = this.canvasMap.get(str)) && void 0 !== _a ? _a : null;
       }
       getRootElement() {
         return null;
@@ -29243,13 +29448,11 @@
       }
       return null;
     }
-    function getCanvasSize(domref, width, height) {
-      const resolvedWidth = null != width ? width : null == domref ? void 0 : domref.width,
-        resolvedHeight = null != height ? height : null == domref ? void 0 : domref.height;
-      if (!isValidCoordinate(resolvedWidth) || !isValidCoordinate(resolvedHeight)) throw new Error(LYNX_CANVAS_SIZE_ERROR);
+    function getCanvasSize(width, height) {
+      if (!isValidCoordinate(width) || !isValidCoordinate(height)) throw new Error(LYNX_CANVAS_SIZE_ERROR);
       return {
-        width: resolvedWidth,
-        height: resolvedHeight
+        width: width,
+        height: height
       };
     }
     function wrapLynxNativeCanvas(nativeCanvas, id, width, height, dpr) {
@@ -29273,29 +29476,6 @@
       }
       throw new Error(LYNX_CANVAS_BRIDGE_ERROR);
     }
-    function makeUpCanvas$3(params = {}, canvasMap, freeCanvasList) {
-      const runtime = getLynxRuntime(params),
-        {
-          domref: domref,
-          canvasIdLists = [],
-          freeCanvasIdx = 0
-        } = params,
-        offscreen = !!params.offscreen,
-        dpr = getLynxPixelRatio(params, runtime);
-      if (canvasIdLists.forEach((id, i) => {
-        const size = getCanvasSize(domref),
-          canvas = wrapLynxNativeCanvas(createLynxNativeCanvas(id, size.width, size.height, dpr, offscreen, params, runtime), id, size.width, size.height, dpr);
-        canvasMap.set(id, canvas), i > freeCanvasIdx && freeCanvasList.push(canvas);
-      }), !freeCanvasList.length && domref && "function" == typeof (null == runtime ? void 0 : runtime.createOffscreenCanvas)) {
-        const size = getCanvasSize(domref),
-          _canvas = runtime.createOffscreenCanvas();
-        _canvas.width = size.width * dpr, _canvas.height = size.height * dpr;
-        const ctx = _canvas.getContext("2d"),
-          id = Math.random().toString(),
-          canvas = new CanvasWrapEnableWH(_canvas, ctx, dpr, size.width, size.height, id);
-        canvasMap.set(id, canvas), freeCanvasList.push(canvas);
-      }
-    }
     function createImageElement(src, isSvg = !1, runtime = getGlobalLynxRuntime()) {
       if (isSvg) return Promise.reject();
       if ("function" != typeof (null == runtime ? void 0 : runtime.createImage)) return Promise.reject(new Error("Lynx image bridge is unavailable."));
@@ -29319,7 +29499,7 @@
         this.applyStyles = !0;
       }
       configure(service, params = {}) {
-        service.env === this.type && (service.setActiveEnvContribution(this), this.lynxEnvParams = params, this.lynxRuntime = getLynxRuntime(params), makeUpCanvas$3(params, this.canvasMap, this.freeCanvasList));
+        service.env === this.type && (service.setActiveEnvContribution(this), this.lynxEnvParams = params, this.lynxRuntime = getLynxRuntime(params));
       }
       getDynamicCanvasCount() {
         return this.freeCanvasList.length;
@@ -29351,7 +29531,7 @@
           const envParams = null !== (_a = this.lynxEnvParams) && void 0 !== _a ? _a : {},
             runtime = getLynxRuntime(envParams),
             dpr = null !== (_b = params.dpr) && void 0 !== _b ? _b : getLynxPixelRatio(envParams, runtime),
-            size = getCanvasSize(envParams.domref, params.width, params.height),
+            size = getCanvasSize(params.width, params.height),
             canvas = wrapLynxNativeCanvas(createLynxNativeCanvas(id, size.width, size.height, dpr, !1, envParams, runtime), id, size.width, size.height, dpr);
           return this.canvasMap.set(id, canvas), canvas;
         }
@@ -29360,7 +29540,7 @@
         const envParams = null !== (_c = this.lynxEnvParams) && void 0 !== _c ? _c : {},
           runtime = getLynxRuntime(envParams),
           dpr = null !== (_d = params.dpr) && void 0 !== _d ? _d : getLynxPixelRatio(envParams, runtime),
-          size = getCanvasSize(envParams.domref, params.width, params.height),
+          size = getCanvasSize(params.width, params.height),
           id = Math.random().toString(),
           canvas = wrapLynxNativeCanvas(createLynxNativeCanvas(id, size.width, size.height, dpr, !0, envParams, runtime), id, size.width, size.height, dpr);
         return this.canvasMap.set(id, canvas), this.freeCanvasList.push(canvas), canvas;
@@ -29671,7 +29851,12 @@
       createWindowByCanvas(params) {
         let canvas;
         if ("string" == typeof params.canvas) {
-          if (canvas = this.global.getElementById(params.canvas), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
+          if (canvas = this.global.getElementById(params.canvas), canvas || (canvas = this.global.createCanvas({
+            id: params.canvas,
+            width: params.width,
+            height: params.height,
+            dpr: params.dpr
+          })), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
         } else canvas = params.canvas;
         let width = params.width,
           height = params.height;
@@ -29756,16 +29941,10 @@
       (null === (_a = container.isBound) || void 0 === _a ? void 0 : _a.call(container, TaroWindowHandlerContribution)) || container.bind(TaroWindowHandlerContribution).toSelf(), (null === (_b = container.getNamed) || void 0 === _b ? void 0 : _b.call(container, WindowHandlerContribution, TaroWindowHandlerContribution.env)) || container.bind(WindowHandlerContribution).toService(TaroWindowHandlerContribution).whenTargetNamed(TaroWindowHandlerContribution.env);
     }
 
-    function makeUpCanvas$2(domref, canvasIdLists, canvasMap, freeCanvasIdx, freeCanvasList, taro, dpr) {
-      canvasIdLists.forEach((id, i) => {
-        const ctx = taro.createCanvasContext(id),
-          canvas = new CanvasWrapDisableWH(ctx.canvas || {}, ctx, dpr, domref.width, domref.height, id);
-        return ctx.canvas = canvas, canvasMap.set(id, canvas), i >= freeCanvasIdx && freeCanvasList.push(canvas), canvas;
-      });
-    }
+    const TARO_CANVAS_BRIDGE_ERROR = "Taro canvas bridge is unavailable. VRender taro env requires envParams.canvasFactory, a Stage canvas object, or envParams.taro.createCanvasContext(id).";
     class TaroEnvContribution extends BaseEnvContribution {
       constructor() {
-        super(), this.type = "taro", this.supportEvent = !0, this.canvasMap = new Map(), this.freeCanvasList = [], this.canvasIdx = 0, this.supportsTouchEvents = !0;
+        super(), this.type = "taro", this.supportEvent = !0, this.canvasMap = new Map(), this.pixelRatio = 1, this.taroEnvParams = {}, this.supportsTouchEvents = !0;
         try {
           this.supportsPointerEvents = !!globalThis.PointerEvent, this.supportsMouseEvents = !!globalThis.MouseEvent;
         } catch (err) {
@@ -29774,7 +29953,7 @@
         this.applyStyles = !0;
       }
       getDynamicCanvasCount() {
-        return this.freeCanvasList.length;
+        return 0;
       }
       getStaticCanvasCount() {
         return 9999;
@@ -29783,8 +29962,9 @@
         var _a;
         return null === (_a = null == event ? void 0 : event.type) || void 0 === _a || _a.startsWith("mouse"), event;
       }
-      configure(service, params) {
-        service.env === this.type && (service.setActiveEnvContribution(this), makeUpCanvas$2(params.domref, params.canvasIdLists, this.canvasMap, params.freeCanvasIdx, this.freeCanvasList, params.taro, params.pixelRatio), this.taro = params.taro, this.pixelRatio = params.pixelRatio);
+      configure(service, params = {}) {
+        var _a;
+        service.env === this.type && (service.setActiveEnvContribution(this), this.taroEnvParams = params, this.taro = params.taro, this.pixelRatio = null !== (_a = params.pixelRatio) && void 0 !== _a ? _a : 1);
       }
       loadImage(url) {
         return Promise.resolve({
@@ -29793,7 +29973,7 @@
         });
       }
       loadSvg(svgStr) {
-        const _window = window || globalThis;
+        const _window = "undefined" != typeof window ? window : globalThis;
         if (_window.DOMParser) {
           const svg = new _window.DOMParser().parseFromString(svgStr, "image/svg+xml").children[0],
             data = new XMLSerializer().serializeToString(svg),
@@ -29816,8 +29996,15 @@
         return Promise.reject();
       }
       createCanvas(params) {
-        const result = this.freeCanvasList[this.canvasIdx] || this.freeCanvasList[this.freeCanvasList.length - 1];
-        return this.canvasIdx++, result;
+        var _a, _b;
+        const envParams = this.taroEnvParams,
+          dpr = null !== (_a = params.dpr) && void 0 !== _a ? _a : this.getDevicePixelRatio(),
+          factoryCanvas = createCanvasWithFactory(params, dpr, this.canvasMap, envParams.canvasFactory);
+        if (factoryCanvas) return factoryCanvas;
+        const options = getMiniAppCanvasOptions(params, dpr, !1);
+        if (null == options.id || "function" != typeof (null === (_b = envParams.taro) || void 0 === _b ? void 0 : _b.createCanvasContext)) throw new Error(TARO_CANVAS_BRIDGE_ERROR);
+        const canvas = wrapMiniAppContextCanvas(envParams.taro.createCanvasContext(options.id), options);
+        return this.canvasMap.set(options.id, canvas), canvas;
       }
       createOffscreenCanvas(params) {}
       releaseCanvas(canvas) {}
@@ -29925,7 +30112,12 @@
       createWindowByCanvas(params) {
         let canvas;
         if ("string" == typeof params.canvas) {
-          if (canvas = this.global.getElementById(params.canvas), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
+          if (canvas = this.global.getElementById(params.canvas), canvas || (canvas = this.global.createCanvas({
+            id: params.canvas,
+            width: params.width,
+            height: params.height,
+            dpr: params.dpr
+          })), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
         } else canvas = params.canvas;
         let width = params.width,
           height = params.height;
@@ -30000,51 +30192,22 @@
       (null === (_a = container.isBound) || void 0 === _a ? void 0 : _a.call(container, TTWindowHandlerContribution)) || container.bind(TTWindowHandlerContribution).toSelf(), (null === (_b = container.getNamed) || void 0 === _b ? void 0 : _b.call(container, WindowHandlerContribution, TTWindowHandlerContribution.env)) || container.bind(WindowHandlerContribution).toService(TTWindowHandlerContribution).whenTargetNamed(TTWindowHandlerContribution.env);
     }
 
-    var __awaiter$2 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
-      return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) {
-          try {
-            step(generator.next(value));
-          } catch (e) {
-            reject(e);
-          }
-        }
-        function rejected(value) {
-          try {
-            step(generator.throw(value));
-          } catch (e) {
-            reject(e);
-          }
-        }
-        function step(result) {
-          var value;
-          result.done ? resolve(result.value) : (value = result.value, value instanceof P ? value : new P(function (resolve) {
-            resolve(value);
-          })).then(fulfilled, rejected);
-        }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-      });
-    };
-    function makeUpCanvas$1(domref, canvasIdLists, canvasMap, freeCanvasIdx, freeCanvasList, component) {
-      return __awaiter$2(this, void 0, void 0, function* () {
-        const dpr = tt.getSystemInfoSync().pixelRatio;
-        for (let i = 0; i < canvasIdLists.length; i++) {
-          const id = canvasIdLists[i];
-          yield new Promise(resolve => {
-            let data = tt.createSelectorQuery();
-            component && (data = data.in(component)), data.select(`#${id}`).node().exec(res => {
-              const canvas = res[0].node,
-                width = canvas.width,
-                height = canvas.height;
-              canvas.width = width * dpr, canvas.height = height * dpr, canvasMap.set(id, canvas), i >= freeCanvasIdx && freeCanvasList.push(canvas), resolve(null);
-            });
-          });
-        }
-      });
+    const TT_CANVAS_BRIDGE_ERROR = "TT canvas bridge is unavailable. VRender tt env requires envParams.canvasFactory, a Stage canvas object, or a tt runtime that exposes createCanvasContext(id).";
+    function getTTRuntime(params) {
+      var _a, _b, _c;
+      try {
+        return null !== (_b = null !== (_a = null == params ? void 0 : params.tt) && void 0 !== _a ? _a : null == params ? void 0 : params.runtime) && void 0 !== _b ? _b : "undefined" != typeof tt ? tt : void 0;
+      } catch (_d) {
+        return null !== (_c = null == params ? void 0 : params.tt) && void 0 !== _c ? _c : null == params ? void 0 : params.runtime;
+      }
+    }
+    function getTTPixelRatio(params, runtime = getTTRuntime(params)) {
+      var _a, _b, _c, _d;
+      return null !== (_d = null !== (_a = null == params ? void 0 : params.pixelRatio) && void 0 !== _a ? _a : null === (_c = null === (_b = null == runtime ? void 0 : runtime.getSystemInfoSync) || void 0 === _b ? void 0 : _b.call(runtime)) || void 0 === _c ? void 0 : _c.pixelRatio) && void 0 !== _d ? _d : 1;
     }
     class TTEnvContribution extends BaseEnvContribution {
       constructor() {
-        super(), this.type = "tt", this.supportEvent = !0, this.canvasMap = new Map(), this.freeCanvasList = [], this.canvasIdx = 0, this.supportsTouchEvents = !0;
+        super(), this.type = "tt", this.supportEvent = !0, this.canvasMap = new Map(), this.ttEnvParams = {}, this.supportsTouchEvents = !0;
         try {
           this.supportsPointerEvents = !!globalThis.PointerEvent, this.supportsMouseEvents = !!globalThis.MouseEvent;
         } catch (err) {
@@ -30052,8 +30215,8 @@
         }
         this.applyStyles = !0;
       }
-      configure(service, params) {
-        if (service.env === this.type) return service.setActiveEnvContribution(this), makeUpCanvas$1(params.domref, params.canvasIdLists, this.canvasMap, params.freeCanvasIdx, this.freeCanvasList, params.component).then(() => {});
+      configure(service, params = {}) {
+        service.env === this.type && (service.setActiveEnvContribution(this), this.ttEnvParams = params);
       }
       loadImage(url) {
         return Promise.resolve({
@@ -30065,13 +30228,21 @@
         return Promise.reject();
       }
       createCanvas(params) {
-        const result = this.freeCanvasList[this.canvasIdx] || this.freeCanvasList[this.freeCanvasList.length - 1];
-        return this.canvasIdx++, result;
+        var _a;
+        const envParams = this.ttEnvParams,
+          runtime = getTTRuntime(envParams),
+          dpr = null !== (_a = params.dpr) && void 0 !== _a ? _a : getTTPixelRatio(envParams, runtime),
+          factoryCanvas = createCanvasWithFactory(params, dpr, this.canvasMap, envParams.canvasFactory);
+        if (factoryCanvas) return factoryCanvas;
+        const options = getMiniAppCanvasOptions(params, dpr, !1);
+        if (null == options.id || "function" != typeof (null == runtime ? void 0 : runtime.createCanvasContext)) throw new Error(TT_CANVAS_BRIDGE_ERROR);
+        const canvas = wrapMiniAppContextCanvas(runtime.createCanvasContext(options.id), options);
+        return this.canvasMap.set(options.id, canvas), canvas;
       }
       createOffscreenCanvas(params) {}
       releaseCanvas(canvas) {}
       getDevicePixelRatio() {
-        return tt.getSystemInfoSync().pixelRatio;
+        return getTTPixelRatio(this.ttEnvParams);
       }
       getRequestAnimationFrame() {
         return function (callback) {
@@ -30192,7 +30363,12 @@
       createWindowByCanvas(params) {
         let canvas;
         if ("string" == typeof params.canvas) {
-          if (canvas = this.global.getElementById(params.canvas), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
+          if (canvas = this.global.getElementById(params.canvas), canvas || (canvas = this.global.createCanvas({
+            id: params.canvas,
+            width: params.width,
+            height: params.height,
+            dpr: params.dpr
+          })), !canvas) throw new Error("canvasId 参数不正确，请确认canvas存在并插入dom");
         } else canvas = params.canvas;
         let width = params.width,
           height = params.height;
@@ -30270,55 +30446,22 @@
       (null === (_a = container.isBound) || void 0 === _a ? void 0 : _a.call(container, WxWindowHandlerContribution)) || container.bind(WxWindowHandlerContribution).toSelf(), (null === (_b = container.getNamed) || void 0 === _b ? void 0 : _b.call(container, WindowHandlerContribution, WxWindowHandlerContribution.env)) || container.bind(WindowHandlerContribution).toService(WxWindowHandlerContribution).whenTargetNamed(WxWindowHandlerContribution.env);
     }
 
-    var __awaiter$1 = undefined && undefined.__awaiter || function (thisArg, _arguments, P, generator) {
-      return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) {
-          try {
-            step(generator.next(value));
-          } catch (e) {
-            reject(e);
-          }
-        }
-        function rejected(value) {
-          try {
-            step(generator.throw(value));
-          } catch (e) {
-            reject(e);
-          }
-        }
-        function step(result) {
-          var value;
-          result.done ? resolve(result.value) : (value = result.value, value instanceof P ? value : new P(function (resolve) {
-            resolve(value);
-          })).then(fulfilled, rejected);
-        }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-      });
-    };
-    function makeUpCanvas(domref, canvasIdLists, canvasMap, freeCanvasIdx, freeCanvasList, component, forceUpdate) {
-      return __awaiter$1(this, void 0, void 0, function* () {
-        const dpr = wx.getSystemInfoSync().pixelRatio;
-        for (let i = 0; i < canvasIdLists.length; i++) {
-          const id = canvasIdLists[i];
-          !forceUpdate && canvasMap.has(id) || (yield new Promise(resolve => {
-            let data = wx.createSelectorQuery();
-            component && (data = data.in(component)), data.select(`#${id}`).fields({
-              node: !0,
-              size: !0
-            }).exec(res => {
-              if (!res[0]) return;
-              const canvas = res[0].node,
-                width = res[0].width,
-                height = res[0].height;
-              canvas.width = width * dpr, canvas.height = height * dpr, canvasMap.set(id, canvas), i >= freeCanvasIdx && freeCanvasList.push(canvas), resolve(null);
-            });
-          }));
-        }
-      });
+    const WX_CANVAS_BRIDGE_ERROR = "Wx canvas bridge is unavailable. VRender wx env requires envParams.canvasFactory, a Stage canvas object, or a wx runtime that exposes createCanvasContext(id).";
+    function getWxRuntime(params) {
+      var _a, _b, _c;
+      try {
+        return null !== (_b = null !== (_a = null == params ? void 0 : params.wx) && void 0 !== _a ? _a : null == params ? void 0 : params.runtime) && void 0 !== _b ? _b : "undefined" != typeof wx ? wx : void 0;
+      } catch (_d) {
+        return null !== (_c = null == params ? void 0 : params.wx) && void 0 !== _c ? _c : null == params ? void 0 : params.runtime;
+      }
+    }
+    function getWxPixelRatio(params, runtime = getWxRuntime(params)) {
+      var _a, _b, _c, _d;
+      return null !== (_d = null !== (_a = null == params ? void 0 : params.pixelRatio) && void 0 !== _a ? _a : null === (_c = null === (_b = null == runtime ? void 0 : runtime.getSystemInfoSync) || void 0 === _b ? void 0 : _b.call(runtime)) || void 0 === _c ? void 0 : _c.pixelRatio) && void 0 !== _d ? _d : 1;
     }
     class WxEnvContribution extends BaseEnvContribution {
       constructor() {
-        super(), this.type = "wx", this.supportEvent = !0, this.canvasMap = new Map(), this.freeCanvasList = [], this.canvasIdx = 0, this.supportsTouchEvents = !0;
+        super(), this.type = "wx", this.supportEvent = !0, this.canvasMap = new Map(), this.wxEnvParams = {}, this.supportsTouchEvents = !0;
         try {
           this.supportsPointerEvents = !!globalThis.PointerEvent, this.supportsMouseEvents = !!globalThis.MouseEvent;
         } catch (err) {
@@ -30326,8 +30469,8 @@
         }
         this.applyStyles = !0;
       }
-      configure(service, params) {
-        if (service.env === this.type) return service.setActiveEnvContribution(this), makeUpCanvas(params.domref, params.canvasIdLists, this.canvasMap, params.freeCanvasIdx, this.freeCanvasList, params.component, params.forceUpdate).then(() => {});
+      configure(service, params = {}) {
+        service.env === this.type && (service.setActiveEnvContribution(this), this.wxEnvParams = params);
       }
       loadImage(url) {
         return Promise.resolve({
@@ -30342,13 +30485,21 @@
         });
       }
       createCanvas(params) {
-        const result = this.freeCanvasList[this.canvasIdx] || this.freeCanvasList[this.freeCanvasList.length - 1];
-        return this.canvasIdx++, result;
+        var _a;
+        const envParams = this.wxEnvParams,
+          runtime = getWxRuntime(envParams),
+          dpr = null !== (_a = params.dpr) && void 0 !== _a ? _a : getWxPixelRatio(envParams, runtime),
+          factoryCanvas = createCanvasWithFactory(params, dpr, this.canvasMap, envParams.canvasFactory);
+        if (factoryCanvas) return factoryCanvas;
+        const options = getMiniAppCanvasOptions(params, dpr, !1);
+        if (null == options.id || "function" != typeof (null == runtime ? void 0 : runtime.createCanvasContext)) throw new Error(WX_CANVAS_BRIDGE_ERROR);
+        const canvas = wrapMiniAppContextCanvas(runtime.createCanvasContext(options.id), options);
+        return this.canvasMap.set(options.id, canvas), canvas;
       }
       createOffscreenCanvas(params) {}
       releaseCanvas(canvas) {}
       getDevicePixelRatio() {
-        return wx.getSystemInfoSync().pixelRatio;
+        return getWxPixelRatio(this.wxEnvParams);
       }
       getRequestAnimationFrame() {
         return function (callback) {
@@ -45369,14 +45520,6 @@
       }
       return t;
     };
-    function cloneAttributeSnapshot(value) {
-      if (!isObject$1(value) || isArray$1(value)) return value;
-      const snapshot = {};
-      return Object.keys(value).forEach(key => {
-        const nextValue = value[key];
-        snapshot[key] = isObject$1(nextValue) && !isArray$1(nextValue) ? cloneAttributeSnapshot(nextValue) : nextValue;
-      }), snapshot;
-    }
     loadLabelComponent();
     class LabelBase extends AnimateComponent {
       setBitmap(bitmap) {
@@ -45420,7 +45563,7 @@
       }
       labeling(textBounds, graphicBounds, position, offset) {}
       _getLabelLinePoints(text, baseMark) {
-        return connectLineBetweenBounds(text.AABBBounds, null == baseMark ? void 0 : baseMark.AABBBounds);
+        return connectLineBetweenBounds(text.AABBBounds, this.getGraphicFinalLayoutBounds(baseMark));
       }
       _createLabelLine(text, baseMark) {
         const points = this._getLabelLinePoints(text, baseMark);
@@ -45488,11 +45631,8 @@
       }
       render() {
         if (this._exitReleaseState) return;
-        if (this._prepare(), isNil$1(this._idToGraphic) || this._isCollectionBase && isNil$1(this._idToPoint)) return;
-        const markAttributeList = [];
-        !1 !== this._enableAnimation && this._baseMarks.forEach(mark => {
-          markAttributeList.push(cloneAttributeSnapshot(mark.attribute)), mark.initAttributes(this.getGraphicFinalLayoutAttributes(mark));
-        });
+        if (this._finalLayoutBoundsCache = void 0, this._prepare(), isNil$1(this._idToGraphic) || this._isCollectionBase && isNil$1(this._idToPoint)) return;
+        this._finalLayoutBoundsCache = new Map();
         const {
           overlap: overlap,
           smartInvert: smartInvert,
@@ -45517,9 +45657,7 @@
         }
         isFunction$1(customOverlapFunc) ? labels = customOverlapFunc(overlapLabels, this.getRelatedGraphic.bind(this), this._isCollectionBase ? d => this._idToPoint.get(d.id) : null, this).concat(filteredLabels) : !1 !== overlap && (labels = this._overlapping(overlapLabels).concat(filteredLabels)), isFunction$1(this.attribute.onAfterOverlapping) && this.attribute.onAfterOverlapping(labels, this.getRelatedGraphic.bind(this), this._isCollectionBase ? d => this._idToPoint.get(d.id) : null, this), labels && labels.length && labels.forEach(label => {
           this._bindEvent(label), this._setStatesOfText(label);
-        }), !1 !== smartInvert && this._smartInvert(labels), this._renderLabels(labels), !1 !== this._enableAnimation && this._baseMarks.forEach((mark, index) => {
-          mark.initAttributes(markAttributeList[index]);
-        });
+        }), !1 !== smartInvert && this._smartInvert(labels), this._renderLabels(labels), this._finalLayoutBoundsCache = void 0;
       }
       _bindEvent(target) {
         if (this.attribute.disableTriggerEvent) return;
@@ -45586,6 +45724,24 @@
         var _a;
         return !!(null === (_a = null == graphic ? void 0 : graphic.context) || void 0 === _a ? void 0 : _a.finalAttrs);
       }
+      shouldUseGraphicFinalLayoutAttributes(graphic) {
+        var _a;
+        return !!graphic && (!!(null === (_a = graphic.context) || void 0 === _a ? void 0 : _a.animationState) || this.hasGraphicContextFinalLayoutAttributes(graphic));
+      }
+      getGraphicFinalLayoutBounds(graphic) {
+        var _a, _b;
+        if (!graphic) return;
+        const useFinalAttrs = this.shouldUseGraphicFinalLayoutAttributes(graphic),
+          graphicAttrs = useFinalAttrs ? this.getGraphicFinalLayoutAttributes(graphic) : graphic.attribute;
+        if (!1 === (null == graphicAttrs ? void 0 : graphicAttrs.visible)) return;
+        if (!useFinalAttrs) return graphic.AABBBounds;
+        const cachedBounds = null === (_a = this._finalLayoutBoundsCache) || void 0 === _a ? void 0 : _a.get(graphic);
+        if (cachedBounds) return cachedBounds;
+        const clonedGraphic = graphic.clone();
+        clonedGraphic.initAttributes(Object.assign(Object.assign({}, clonedGraphic.attribute), graphicAttrs));
+        const bounds = clonedGraphic.AABBBounds;
+        return null === (_b = this._finalLayoutBoundsCache) || void 0 === _b || _b.set(graphic, bounds), bounds;
+      }
       _initText(data = []) {
         const {
             textStyle = {}
@@ -45733,7 +45889,8 @@
           result = [],
           checkBounds = strategy.some(s => "bound" === s.type);
         avoidBaseMark && (null === (_a = this._baseMarks) || void 0 === _a || _a.forEach(mark => {
-          mark.AABBBounds && bitmap.setRange(boundToRange(bmpTool, mark.AABBBounds, !0));
+          const markBounds = this.getGraphicFinalLayoutBounds(mark);
+          markBounds && bitmap.setRange(boundToRange(bmpTool, markBounds, !0));
         })), avoidMarks.length > 0 && avoidMarks.forEach(avoid => {
           isString$1(avoid) ? getNoneGroupMarksByName(this.getRootNode(), avoid).forEach(avoidMark => {
             avoidMark.AABBBounds && bitmap.setRange(boundToRange(bmpTool, avoidMark.AABBBounds, !0));
@@ -45749,7 +45906,7 @@
               bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(text);
               continue;
             }
-            if (checkBounds && baseMark && baseMark.AABBBounds && this._canPlaceInside(text.AABBBounds, baseMark.AABBBounds)) {
+            if (checkBounds && baseMark && this._canPlaceInside(text.AABBBounds, this.getGraphicFinalLayoutBounds(baseMark))) {
               bitmap.setRange(boundToRange(bmpTool, text.AABBBounds, !0)), result.push(text);
               continue;
             }
@@ -45774,6 +45931,7 @@
         return result;
       }
       isMarkInsideRect(baseMark, bmpTool) {
+        if (!baseMark) return !1;
         const {
             left: left,
             right: right,
@@ -45786,11 +45944,9 @@
             y1: -top,
             y2: bmpTool.height + bottom
           },
-          bounds = baseMark.AABBBounds;
-        if (0 !== bounds.width() && 0 !== bounds.height()) return isRectIntersect(baseMark.AABBBounds, rect, !0);
-        const {
-          attribute: attribute
-        } = baseMark;
+          bounds = this.getGraphicFinalLayoutBounds(baseMark);
+        if (bounds && 0 !== bounds.width() && 0 !== bounds.height()) return isRectIntersect(bounds, rect, !0);
+        const attribute = this.shouldUseGraphicFinalLayoutAttributes(baseMark) ? this.getGraphicFinalLayoutAttributes(baseMark) : baseMark.attribute;
         if ("rect" === baseMark.type) {
           const {
             x: x,
@@ -45815,19 +45971,13 @@
         if (baseMarkGroupName) return this.getRootNode().find(node => node.name === baseMarkGroupName, !0);
       }
       getGraphicBounds(graphic, point = {}, position) {
-        var _a;
         if (graphic) {
-          if (!1 !== graphic.attribute.visible) {
-            if ((null === (_a = graphic.context) || void 0 === _a ? void 0 : _a.animationState) || this.hasGraphicContextFinalLayoutAttributes(graphic)) {
-              const clonedGraphic = graphic.clone();
-              return Object.assign(clonedGraphic.attribute, this.getGraphicFinalLayoutAttributes(graphic)), clonedGraphic.AABBBounds;
-            }
-            return graphic.AABBBounds;
-          }
+          const graphicAttrs = this.shouldUseGraphicFinalLayoutAttributes(graphic) ? this.getGraphicFinalLayoutAttributes(graphic) : graphic.attribute;
+          if (!1 !== graphicAttrs.visible) return this.getGraphicFinalLayoutBounds(graphic);
           const {
             x: x,
             y: y
-          } = graphic.attribute;
+          } = graphicAttrs;
           return {
             x1: x,
             x2: x,
@@ -46015,8 +46165,9 @@
           }
           const invertColor = labelSmartInvert(foregroundColor, backgroundColor, textType, contrastRatiosThreshold, alternativeColors, mode),
             similarColor = contrastAccessibilityChecker(invertColor, brightColor) ? brightColor : darkColor,
-            isInside = this._canPlaceInside(label.AABBBounds, baseMark.AABBBounds),
-            isIntersect = !isInside && label.AABBBounds && baseMark.AABBBounds && baseMark.AABBBounds.intersects(label.AABBBounds);
+            baseMarkBounds = this.getGraphicFinalLayoutBounds(baseMark),
+            isInside = this._canPlaceInside(label.AABBBounds, baseMarkBounds),
+            isIntersect = !isInside && label.AABBBounds && baseMarkBounds && baseMarkBounds.intersects(label.AABBBounds);
           if (isInside || outsideEnable || isIntersect && "inside" === interactInvertType) {
             const fill = smartInvertStrategy(fillStrategy, backgroundColor, invertColor, similarColor);
             if (fill && label.setAttributes({
@@ -56113,7 +56264,7 @@
         return resolveLegacyApp().createStage(params);
     }
 
-    const version = "1.1.0-alpha.22";
+    const version = "1.1.0-alpha.23";
 
     exports.AComponentAnimate = AComponentAnimate;
     exports.ACustomAnimate = ACustomAnimate;