@galacean/effects-threejs 2.0.0-alpha.3 → 2.0.0-alpha.4

package/dist/index.js

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.0.0-alpha.3
+ * Version: v2.0.0-alpha.4
  */
 
 'use strict';
@@ -148,7 +148,7 @@ function __read$3(o, n) {
     return ar;
 }
 
-function __spreadArray$2(to, from, pack) {
+function __spreadArray$3(to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
             if (!ar) ar = Array.prototype.slice.call(from, 0, i);
@@ -166,20 +166,20 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
 // Unique ID creation requires a high quality random # generator. In the browser we therefore
 // require the crypto API and do not support built-in fallback to lower quality random number
 // generators (like Math.random()).
-let getRandomValues;
-const rnds8 = new Uint8Array(16);
-function rng() {
+let getRandomValues$1;
+const rnds8$1 = new Uint8Array(16);
+function rng$1() {
   // lazy load so that environments that need to polyfill have a chance to do so
-  if (!getRandomValues) {
+  if (!getRandomValues$1) {
     // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
-    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
+    getRandomValues$1 = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
 
-    if (!getRandomValues) {
+    if (!getRandomValues$1) {
       throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
     }
   }
 
-  return getRandomValues(rnds8);
+  return getRandomValues$1(rnds8$1);
 }
 
 /**
@@ -187,30 +187,30 @@ function rng() {
  * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
  */
 
-const byteToHex = [];
+const byteToHex$2 = [];
 
 for (let i = 0; i < 256; ++i) {
-  byteToHex.push((i + 0x100).toString(16).slice(1));
+  byteToHex$2.push((i + 0x100).toString(16).slice(1));
 }
 
-function unsafeStringify(arr, offset = 0) {
+function unsafeStringify$1(arr, offset = 0) {
   // Note: Be careful editing this code!  It's been tuned for performance
   // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
-  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
+  return byteToHex$2[arr[offset + 0]] + byteToHex$2[arr[offset + 1]] + byteToHex$2[arr[offset + 2]] + byteToHex$2[arr[offset + 3]] + '-' + byteToHex$2[arr[offset + 4]] + byteToHex$2[arr[offset + 5]] + '-' + byteToHex$2[arr[offset + 6]] + byteToHex$2[arr[offset + 7]] + '-' + byteToHex$2[arr[offset + 8]] + byteToHex$2[arr[offset + 9]] + '-' + byteToHex$2[arr[offset + 10]] + byteToHex$2[arr[offset + 11]] + byteToHex$2[arr[offset + 12]] + byteToHex$2[arr[offset + 13]] + byteToHex$2[arr[offset + 14]] + byteToHex$2[arr[offset + 15]];
 }
 
-const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
-var native = {
-  randomUUID
+const randomUUID$1 = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+var native$1 = {
+  randomUUID: randomUUID$1
 };
 
-function v4(options, buf, offset) {
-  if (native.randomUUID && !buf && !options) {
-    return native.randomUUID();
+function v4$1(options, buf, offset) {
+  if (native$1.randomUUID && !buf && !options) {
+    return native$1.randomUUID();
   }
 
   options = options || {};
-  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+  const rnds = options.random || (options.rng || rng$1)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
 
   rnds[6] = rnds[6] & 0x0f | 0x40;
   rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
@@ -225,7 +225,7 @@ function v4(options, buf, offset) {
     return buf;
   }
 
-  return unsafeStringify(rnds);
+  return unsafeStringify$1(rnds);
 }
 
 function addItem(arr, value) {
@@ -2212,7 +2212,7 @@ var __read$2 = (undefined && undefined.__read) || function (o, n) {
     }
     return ar;
 };
-var __spreadArray$1 = (undefined && undefined.__spreadArray) || function (to, from, pack) {
+var __spreadArray$2 = (undefined && undefined.__spreadArray) || function (to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
             if (!ar) ar = Array.prototype.slice.call(from, 0, i);
@@ -2529,7 +2529,7 @@ var Matrix4 = /** @class */ (function () {
      * @returns 复制结果
      */
     Matrix4.prototype.copyFrom = function (m) {
-        this.elements = __spreadArray$1([], __read$2(m.elements), false);
+        this.elements = __spreadArray$2([], __read$2(m.elements), false);
         return this;
     };
     /**
@@ -3058,7 +3058,7 @@ var Matrix4 = /** @class */ (function () {
      * @returns
      */
     Matrix4.prototype.toArray = function () {
-        return __spreadArray$1([], __read$2(this.elements), false);
+        return __spreadArray$2([], __read$2(this.elements), false);
     };
     Matrix4.prototype.fill = function (array, offset) {
         if (offset === void 0) { offset = 0; }
@@ -4311,7 +4311,7 @@ var __read$1 = (undefined && undefined.__read) || function (o, n) {
     }
     return ar;
 };
-var __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {
+var __spreadArray$1 = (undefined && undefined.__spreadArray) || function (to, from, pack) {
     if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
         if (ar || !(i in from)) {
             if (!ar) ar = Array.prototype.slice.call(from, 0, i);
@@ -4498,7 +4498,7 @@ var Matrix3 = /** @class */ (function () {
      * @returns 复制结果
      */
     Matrix3.prototype.copyFrom = function (m) {
-        this.elements = __spreadArray([], __read$1(m.elements), false);
+        this.elements = __spreadArray$1([], __read$1(m.elements), false);
         return this;
     };
     /**
@@ -4714,7 +4714,7 @@ var Matrix3 = /** @class */ (function () {
      * @returns
      */
     Matrix3.prototype.toArray = function () {
-        return __spreadArray([], __read$1(this.elements), false);
+        return __spreadArray$1([], __read$1(this.elements), false);
     };
     Matrix3.prototype.fill = function (array, offset) {
         if (offset === void 0) { offset = 0; }
@@ -6472,7 +6472,7 @@ function error(message) {
     for (var _i = 1; _i < arguments.length; _i++) {
         args[_i - 1] = arguments[_i];
     }
-    console.error.apply(console, __spreadArray$2(__spreadArray$2([], __read$3(format(message)), false), [args], false));
+    console.error.apply(console, __spreadArray$3(__spreadArray$3([], __read$3(format(message)), false), [args], false));
     localLogger === null || localLogger === void 0 ? void 0 : localLogger('error', message, args);
 }
 /**
@@ -6485,7 +6485,7 @@ function info(message) {
     for (var _i = 1; _i < arguments.length; _i++) {
         args[_i - 1] = arguments[_i];
     }
-    console.debug.apply(console, __spreadArray$2([], __read$3(format(message)), false));
+    console.debug.apply(console, __spreadArray$3([], __read$3(format(message)), false));
     localLogger === null || localLogger === void 0 ? void 0 : localLogger('info', message, args);
 }
 function warn(message) {
@@ -6493,7 +6493,7 @@ function warn(message) {
     for (var _i = 1; _i < arguments.length; _i++) {
         args[_i - 1] = arguments[_i];
     }
-    console.warn.apply(console, __spreadArray$2([], __read$3(format(message)), false));
+    console.warn.apply(console, __spreadArray$3([], __read$3(format(message)), false));
     localLogger === null || localLogger === void 0 ? void 0 : localLogger('warn', message, args);
 }
 /**
@@ -6590,17 +6590,30 @@ function random(min, max) {
 function throwDestroyedError() {
     throw Error('destroyed item cannot be used again');
 }
-function generateGUID() {
-    return v4().replace(/-/g, '');
+function generateGUID$1() {
+    return v4$1().replace(/-/g, '');
 }
 
 /*!
  * Name: @galacean/effects-specification
  * Description: Galacean Effects JSON Specification
  * Author: Ant Group CO., Ltd.
- * Version: v1.0.1
+ * Version: v2.0.0-alpha.2
+ */
+
+typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
  */
 
+const byteToHex$1 = [];
+
+for (let i = 0; i < 256; ++i) {
+  byteToHex$1.push((i + 0x100).toString(16).slice(1));
+}
+
 /*********************************************/
 /*               元素属性参数类型               */
 /*********************************************/
@@ -6863,6 +6876,10 @@ var ItemType$1;
      * 天空盒元素
      */
     ItemType["skybox"] = "skybox";
+    /**
+     * 特效元素
+     */
+    ItemType["effect"] = "effect";
 })(ItemType$1 || (ItemType$1 = {}));
 /**
  * 渲染模式
@@ -6977,6 +6994,10 @@ var CompositionEndBehavior$1;
      * 销毁并保留最后一帧
      */
     CompositionEndBehavior[CompositionEndBehavior["pause_destroy"] = END_BEHAVIOR_PAUSE_AND_DESTROY$1] = "pause_destroy";
+    /**
+     * 冻结
+     */
+    CompositionEndBehavior[CompositionEndBehavior["freeze"] = END_BEHAVIOR_FREEZE$1] = "freeze";
 })(CompositionEndBehavior$1 || (CompositionEndBehavior$1 = {}));
 
 /*********************************************/
@@ -7115,12 +7136,38 @@ var ShapeArcMode$1;
 
 var BloomFilterThresholdAvgColor = 0;
 
+var LightType$1;
+(function (LightType) {
+    /**
+     * 点光源
+     */
+    LightType["point"] = "point";
+    /**
+     * 聚光灯
+     */
+    LightType["spot"] = "spot";
+    /**
+     * 方向光
+     */
+    LightType["directional"] = "directional";
+    /**
+     * 环境光
+     */
+    LightType["ambient"] = "ambient";
+})(LightType$1 || (LightType$1 = {}));
+
 var ModelBoundingType$1;
 (function (ModelBoundingType) {
     ModelBoundingType[ModelBoundingType["box"] = 2] = "box";
     ModelBoundingType[ModelBoundingType["sphere"] = 3] = "sphere";
 })(ModelBoundingType$1 || (ModelBoundingType$1 = {}));
 
+var CameraType$1;
+(function (CameraType) {
+    CameraType["orthographic"] = "orthographic";
+    CameraType["perspective"] = "perspective";
+})(CameraType$1 || (CameraType$1 = {}));
+
 // 材质类型
 var MaterialType$1;
 (function (MaterialType) {
@@ -7266,6 +7313,28 @@ var FontStyle$1;
     FontStyle["oblique"] = "oblique";
 })(FontStyle$1 || (FontStyle$1 = {}));
 
+var DataType$1;
+(function (DataType) {
+    DataType["VFXItemData"] = "VFXItemData";
+    DataType["EffectComponent"] = "EffectComponent";
+    DataType["Material"] = "Material";
+    DataType["Shader"] = "Shader";
+    DataType["SpriteComponent"] = "SpriteComponent";
+    DataType["ParticleSystem"] = "ParticleSystem";
+    DataType["InteractComponent"] = "InteractComponent";
+    DataType["CameraController"] = "CameraController";
+    DataType["Geometry"] = "Geometry";
+    DataType["Texture"] = "Texture";
+    DataType["TextComponent"] = "TextComponent";
+    // FIXME: 先完成ECS的场景转换，后面移到spec中
+    DataType["MeshComponent"] = "MeshComponent";
+    DataType["SkyboxComponent"] = "SkyboxComponent";
+    DataType["LightComponent"] = "LightComponent";
+    DataType["CameraComponent"] = "CameraComponent";
+    DataType["ModelPluginComponent"] = "ModelPluginComponent";
+    DataType["TreeComponent"] = "TreeComponent";
+})(DataType$1 || (DataType$1 = {}));
+
 var index = /*#__PURE__*/Object.freeze({
     __proto__: null,
     get BezierKeyframeType () { return BezierKeyframeType$1; },
@@ -7274,7 +7343,9 @@ var index = /*#__PURE__*/Object.freeze({
     CAMERA_CLIP_MODE_NORMAL: CAMERA_CLIP_MODE_NORMAL$1,
     CAMERA_CLIP_MODE_VERTICAL: CAMERA_CLIP_MODE_VERTICAL$1,
     get CameraClipMode () { return CameraClipMode$1; },
+    get CameraType () { return CameraType$1; },
     get CompositionEndBehavior () { return CompositionEndBehavior$1; },
+    get DataType () { return DataType$1; },
     END_BEHAVIOR_DESTROY: END_BEHAVIOR_DESTROY$1,
     END_BEHAVIOR_DESTROY_CHILDREN: END_BEHAVIOR_DESTROY_CHILDREN$1,
     END_BEHAVIOR_FORWARD: END_BEHAVIOR_FORWARD$1,
@@ -7287,6 +7358,7 @@ var index = /*#__PURE__*/Object.freeze({
     get InteractType () { return InteractType$1; },
     get ItemEndBehavior () { return ItemEndBehavior$1; },
     get ItemType () { return ItemType$1; },
+    get LightType () { return LightType$1; },
     MESSAGE_ITEM_PHRASE_BEGIN: MESSAGE_ITEM_PHRASE_BEGIN,
     MESSAGE_ITEM_PHRASE_END: MESSAGE_ITEM_PHRASE_END,
     get MaskMode () { return MaskMode$1; },
@@ -7478,7 +7550,7 @@ function copy$1(target) {
     }
 }
 
-var _a$6;
+var _a$7;
 function valIfUndefined(val, def) {
     if (val === undefined || val === null) {
         return def;
@@ -7508,15 +7580,15 @@ function getPreMultiAlpha(blending) {
             return 1;
     }
 }
-var downgradeKeywords = (_a$6 = {},
-    _a$6[exports.ShaderType.vertex] = {
+var downgradeKeywords = (_a$7 = {},
+    _a$7[exports.ShaderType.vertex] = {
         in: 'attribute',
         out: 'varying',
     },
-    _a$6[exports.ShaderType.fragment] = {
+    _a$7[exports.ShaderType.fragment] = {
         in: 'varying',
     },
-    _a$6);
+    _a$7);
 /**
  * 生成 shader，检测到 WebGL1 上下文会降级
  * @param marcos - 宏定义数组
@@ -7957,7 +8029,7 @@ function loadMipmapImage(pointer, bins) {
 var EffectsObject = /** @class */ (function () {
     function EffectsObject(engine) {
         this.engine = engine;
-        this.guid = generateGUID();
+        this.guid = generateGUID$1();
         this.taggedProperties = {};
         this.engine.addInstance(this);
     }
@@ -8654,13 +8726,49 @@ exports.GLSLVersion = void 0;
     GLSLVersion["GLSL1"] = "100";
     GLSLVersion["GLSL3"] = "300 es";
 })(exports.GLSLVersion || (exports.GLSLVersion = {}));
-var Shader = /** @class */ (function (_super) {
-    __extends(Shader, _super);
-    function Shader(engine, source) {
+var ShaderVariant = /** @class */ (function (_super) {
+    __extends(ShaderVariant, _super);
+    function ShaderVariant(engine, source) {
         var _this = _super.call(this, engine) || this;
         _this.source = source;
         return _this;
     }
+    return ShaderVariant;
+}(EffectsObject));
+var Shader = /** @class */ (function (_super) {
+    __extends(Shader, _super);
+    function Shader() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Shader.prototype.createVariant = function (macros) {
+        var e_1, _a;
+        var shaderMacros = [];
+        if (macros) {
+            try {
+                for (var _b = __values$1(Object.keys(macros)), _c = _b.next(); !_c.done; _c = _b.next()) {
+                    var key = _c.value;
+                    shaderMacros.push([key, macros[key]]);
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
+        }
+        var shaderVariant = this.engine.getShaderLibrary().createShader(this.shaderData, shaderMacros);
+        shaderVariant.shader = this;
+        return shaderVariant;
+    };
+    Shader.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+        this.shaderData = data;
+    };
+    Shader = __decorate([
+        effectsClass('Shader')
+    ], Shader);
     return Shader;
 }(EffectsObject));
 
@@ -8673,8 +8781,8 @@ function createCopyShader(level, writeDepth) {
     var version = webgl2 ? '#version 300 es' : '';
     return {
         name: EFFECTS_COPY_MESH_NAME,
-        vertex: createShaderWithMarcos([], version + '\n' + COPY_VERTEX_SHADER, exports.ShaderType.vertex, level),
-        fragment: createShaderWithMarcos([], version + '\n' + COPY_FRAGMENT_SHADER, exports.ShaderType.fragment, level),
+        vertex: version + '\n' + COPY_VERTEX_SHADER,
+        fragment: version + '\n' + COPY_FRAGMENT_SHADER,
         glslVersion: webgl2 ? exports.GLSLVersion.GLSL3 : exports.GLSLVersion.GLSL1,
         marcos: [
             ['WEBGL2', !!webgl2],
@@ -8806,13 +8914,13 @@ var SemanticMap = /** @class */ (function () {
     return SemanticMap;
 }());
 
-var _a$5;
-var BYTES_TYPE_MAP = (_a$5 = {},
-    _a$5[glContext.FLOAT] = Float32Array.BYTES_PER_ELEMENT,
-    _a$5[glContext.INT] = Int32Array.BYTES_PER_ELEMENT,
-    _a$5[glContext.SHORT] = Int16Array.BYTES_PER_ELEMENT,
-    _a$5[glContext.BYTE] = Int8Array.BYTES_PER_ELEMENT,
-    _a$5);
+var _a$6;
+var BYTES_TYPE_MAP = (_a$6 = {},
+    _a$6[glContext.FLOAT] = Float32Array.BYTES_PER_ELEMENT,
+    _a$6[glContext.INT] = Int32Array.BYTES_PER_ELEMENT,
+    _a$6[glContext.SHORT] = Int16Array.BYTES_PER_ELEMENT,
+    _a$6[glContext.BYTE] = Int8Array.BYTES_PER_ELEMENT,
+    _a$6);
 /**
  * Geometry 抽象类
  */
@@ -9381,7 +9489,7 @@ var RenderPass = /** @class */ (function () {
     RenderPass.prototype.setMeshes = function (meshes) {
         var _a;
         this.meshes.length = 0;
-        (_a = this.meshes).splice.apply(_a, __spreadArray$2([0, 0], __read$3(meshes), false));
+        (_a = this.meshes).splice.apply(_a, __spreadArray$3([0, 0], __read$3(meshes), false));
         sortByOrder(this.meshes, this.meshOrder);
         return this.meshes;
     };
@@ -11575,9 +11683,6 @@ var AssetLoader = /** @class */ (function () {
             case exports.DataType.Texture:
                 effectsObject = Texture.create(this.engine, effectsObjectData);
                 return effectsObject;
-            case exports.DataType.Shader:
-                effectsObject = this.engine.getShaderLibrary().createShader(effectsObjectData);
-                break;
             default: {
                 var classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
                 if (classConstructor) {
@@ -11630,9 +11735,6 @@ var AssetLoader = /** @class */ (function () {
                             case exports.DataType.Texture:
                                 effectsObject = Texture.create(this.engine, effectsObjectData);
                                 return [2 /*return*/, effectsObject];
-                            case exports.DataType.Shader:
-                                effectsObject = this.engine.getShaderLibrary().createShader(effectsObjectData);
-                                break;
                             default: {
                                 classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
                                 if (classConstructor) {
@@ -11845,7 +11947,7 @@ function calculateTranslation(out, target, acc, time, duration, posData, velData
     return ret;
 }
 
-var _a$4;
+var _a$5;
 function ensureVec3(num) {
     return Array.isArray(num) ? [num[0], num[1], num[2]] : [0, 0, 0];
 }
@@ -11868,7 +11970,7 @@ function vecNormalize(out, a) {
         out = [];
     }
     var ap = a;
-    var sum = Math.hypot.apply(Math, __spreadArray$2([], __read$3(ap), false));
+    var sum = Math.hypot.apply(Math, __spreadArray$3([], __read$3(ap), false));
     if (sum === 0) {
         return vecAssign(out, ap, ap.length);
     }
@@ -11899,17 +12001,17 @@ function vecMulCombine(out, a, b) {
     }
     return out;
 }
-var particleOriginTranslateMap = (_a$4 = {},
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_CENTER] = [0, 0],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_CENTER_BOTTOM] = [0, -0.5],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_CENTER_TOP] = [0, 0.5],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_LEFT_TOP] = [-0.5, 0.5],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_LEFT_CENTER] = [-0.5, 0],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_LEFT_BOTTOM] = [-0.5, -0.5],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_RIGHT_CENTER] = [0.5, 0],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_RIGHT_BOTTOM] = [0.5, -0.5],
-    _a$4[ParticleOrigin$1.PARTICLE_ORIGIN_RIGHT_TOP] = [0.5, 0.5],
-    _a$4);
+var particleOriginTranslateMap$1 = (_a$5 = {},
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_CENTER] = [0, 0],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_CENTER_BOTTOM] = [0, -0.5],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_CENTER_TOP] = [0, 0.5],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_LEFT_TOP] = [-0.5, 0.5],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_LEFT_CENTER] = [-0.5, 0],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_LEFT_BOTTOM] = [-0.5, -0.5],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_RIGHT_CENTER] = [0.5, 0],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_RIGHT_BOTTOM] = [0.5, -0.5],
+    _a$5[ParticleOrigin$1.PARTICLE_ORIGIN_RIGHT_TOP] = [0.5, 0.5],
+    _a$5);
 function nearestPowerOfTwo(value) {
     return Math.pow(2, Math.round(Math.log(value) / Math.LN2));
 }
@@ -11934,7 +12036,7 @@ function trianglesFromRect(position, halfWidth, halfHeight) {
     ];
 }
 
-var _a$3;
+var _a$4;
 var NOT_IMPLEMENT = 'not_implement';
 var ValueGetter = /** @class */ (function () {
     function ValueGetter(arg) {
@@ -12442,50 +12544,50 @@ var BezierSegments = /** @class */ (function (_super) {
     };
     return BezierSegments;
 }(PathSegments));
-var map$1 = (_a$3 = {},
-    _a$3[ValueType$1.RANDOM] = function (props) {
+var map$1 = (_a$4 = {},
+    _a$4[ValueType$1.RANDOM] = function (props) {
         if (props[0] instanceof Array) {
             return new RandomVectorValue(props);
         }
         return new RandomValue(props);
     },
-    _a$3[ValueType$1.CONSTANT] = function (props) {
+    _a$4[ValueType$1.CONSTANT] = function (props) {
         return new StaticValue(props);
     },
-    _a$3[ValueType$1.CONSTANT_VEC2] = function (props) {
+    _a$4[ValueType$1.CONSTANT_VEC2] = function (props) {
         return new StaticValue(props);
     },
-    _a$3[ValueType$1.CONSTANT_VEC3] = function (props) {
+    _a$4[ValueType$1.CONSTANT_VEC3] = function (props) {
         return new StaticValue(props);
     },
-    _a$3[ValueType$1.CONSTANT_VEC4] = function (props) {
+    _a$4[ValueType$1.CONSTANT_VEC4] = function (props) {
         return new StaticValue(props);
     },
-    _a$3[ValueType$1.CURVE] = function (props) {
+    _a$4[ValueType$1.CURVE] = function (props) {
         return new CurveValue(props);
     },
-    _a$3[ValueType$1.RGBA_COLOR] = function (props) {
+    _a$4[ValueType$1.RGBA_COLOR] = function (props) {
         return new StaticValue(props);
     },
-    _a$3[ValueType$1.COLORS] = function (props) {
+    _a$4[ValueType$1.COLORS] = function (props) {
         return new RandomSetValue(props.map(function (c) { return colorToArr$1(c, false); }));
     },
-    _a$3[ValueType$1.LINE] = function (props) {
+    _a$4[ValueType$1.LINE] = function (props) {
         if (props.length === 2 && props[0][0] === 0 && props[1][0] === 1) {
             return new LinearValue([props[0][1], props[1][1]]);
         }
         return new LineSegments(props);
     },
-    _a$3[ValueType$1.GRADIENT_COLOR] = function (props) {
+    _a$4[ValueType$1.GRADIENT_COLOR] = function (props) {
         return new GradientValue(props);
     },
-    _a$3[ValueType$1.LINEAR_PATH] = function (pros) {
+    _a$4[ValueType$1.LINEAR_PATH] = function (pros) {
         return new PathSegments(pros);
     },
-    _a$3[ValueType$1.BEZIER_PATH] = function (pros) {
+    _a$4[ValueType$1.BEZIER_PATH] = function (pros) {
         return new BezierSegments(pros);
     },
-    _a$3);
+    _a$4);
 function createValueGetter(args) {
     if (!args || !isNaN(+args)) {
         return new StaticValue(args || 0);
@@ -13436,13 +13538,13 @@ var InteractMesh = /** @class */ (function () {
             ['ENV_EDITOR', ((_a = this.engine.renderer) === null || _a === void 0 ? void 0 : _a.env) === PLAYER_OPTIONS_ENV_EDITOR],
         ];
         var color = createValueGetter(this.color).getValue(0);
-        var level = this.engine.gpuCapability.level;
         var materialProps = {
             shader: {
-                vertex: createShaderWithMarcos(marcos, vertex, exports.ShaderType.vertex, level),
-                fragment: createShaderWithMarcos(marcos, fragment, exports.ShaderType.fragment, level),
+                vertex: vertex,
+                fragment: fragment,
                 glslVersion: exports.GLSLVersion.GLSL1,
                 cacheId: "".concat(rendererOptions.cachePrefix, "_effects_interact"),
+                marcos: marcos,
             },
             uniformSemantics: {
                 effects_MatrixVP: 'VIEWPROJECTION',
@@ -13516,11 +13618,11 @@ var InteractComponent = /** @class */ (function (_super) {
     }
     InteractComponent_1 = InteractComponent;
     InteractComponent.prototype.start = function () {
-        var _a, _b, _c;
+        var _this = this;
         var options = this.item.props.content.options;
-        var env = ((_b = (_a = this.item.engine) === null || _a === void 0 ? void 0 : _a.renderer) !== null && _b !== void 0 ? _b : {}).env;
+        var env = this.item.engine.renderer.env;
         var composition = this.item.composition;
-        var _d = this.interactData.options, type = _d.type, showPreview = _d.showPreview;
+        var _a = this.interactData.options, type = _a.type, showPreview = _a.showPreview;
         if (type === InteractType$1.CLICK) {
             this.clickable = true;
             if (showPreview && env === PLAYER_OPTIONS_ENV_EDITOR) {
@@ -13528,7 +13630,8 @@ var InteractComponent = /** @class */ (function (_super) {
                 this.previewContent = new InteractMesh(this.item.props.content, rendererOptions, this.transform, this.engine);
             }
         }
-        (_c = this.item.composition) === null || _c === void 0 ? void 0 : _c.addInteractiveItem(this.item, options.type);
+        composition.addInteractiveItem(this.item, options.type);
+        this.item.onEnd = function () { return composition.removeInteractiveItem(_this.item, options.type); };
         if (options.type === InteractType$1.DRAG) {
             if (env !== PLAYER_OPTIONS_ENV_EDITOR || options.enableInEditor) {
                 composition.event && this.beginDragTarget(options, composition.event);
@@ -13721,8 +13824,8 @@ function spriteMeshShaderFromFilter(level, options) {
     var fragment = wireframe ? itemFrameFrag : itemFrag.replace(/#pragma\s+FILTER_FRAG/, '');
     var vertex = itemVert.replace(/#pragma\s+FILTER_VERT/, 'vec4 filterMain(float t,vec4 pos){return effects_MatrixVP * pos;}');
     return {
-        fragment: createShaderWithMarcos(marcos, fragment, exports.ShaderType.fragment, level),
-        vertex: createShaderWithMarcos(marcos, vertex, exports.ShaderType.vertex, level),
+        fragment: fragment,
+        vertex: vertex,
         glslVersion: level === 1 ? exports.GLSLVersion.GLSL1 : exports.GLSLVersion.GLSL3,
         marcos: marcos,
         shared: true,
@@ -15202,8 +15305,8 @@ var ParticleMesh = /** @class */ (function () {
         var originalVertex = "#define LOOKUP_TEXTURE_CURVE ".concat(vertex_lookup_texture, "\n").concat(particleVert);
         var vertex = originalVertex;
         var shader = {
-            fragment: createShaderWithMarcos(marcos, fragment, exports.ShaderType.fragment, level),
-            vertex: createShaderWithMarcos(marcos, vertex, exports.ShaderType.vertex, level),
+            fragment: fragment,
+            vertex: vertex,
             glslVersion: level === 1 ? exports.GLSLVersion.GLSL1 : exports.GLSLVersion.GLSL3,
             shared: true,
             cacheId: shaderCache,
@@ -15758,8 +15861,8 @@ var TrailMesh = /** @class */ (function () {
         else {
             uniformValues.uVCurveValues = CurveValue.getAllData(keyFrameMeta);
         }
-        var vertex = createShaderWithMarcos(marcos, trailVert, exports.ShaderType.vertex, level);
-        var fragment = createShaderWithMarcos(marcos, particleFrag, exports.ShaderType.fragment, level);
+        var vertex = trailVert;
+        var fragment = particleFrag;
         var mtl = ({
             shader: {
                 vertex: vertex,
@@ -16446,7 +16549,7 @@ var TextureShape = /** @class */ (function () {
     return TextureShape;
 }());
 
-var _a$2;
+var _a$3;
 var ShapeNone = /** @class */ (function () {
     function ShapeNone() {
     }
@@ -16458,18 +16561,18 @@ var ShapeNone = /** @class */ (function () {
     };
     return ShapeNone;
 }());
-var map = (_a$2 = {},
-    _a$2[ShapeType$1.NONE] = ShapeNone,
-    _a$2[ShapeType$1.CONE] = Cone,
-    _a$2[ShapeType$1.SPHERE] = Sphere,
-    _a$2[ShapeType$1.HEMISPHERE] = Hemisphere,
-    _a$2[ShapeType$1.CIRCLE] = Circle,
-    _a$2[ShapeType$1.DONUT] = Donut,
-    _a$2[ShapeType$1.RECTANGLE] = Rectangle,
-    _a$2[ShapeType$1.EDGE] = Edge,
-    _a$2[ShapeType$1.RECTANGLE_EDGE] = RectangleEdge,
-    _a$2[ShapeType$1.TEXTURE] = TextureShape,
-    _a$2);
+var map = (_a$3 = {},
+    _a$3[ShapeType$1.NONE] = ShapeNone,
+    _a$3[ShapeType$1.CONE] = Cone,
+    _a$3[ShapeType$1.SPHERE] = Sphere,
+    _a$3[ShapeType$1.HEMISPHERE] = Hemisphere,
+    _a$3[ShapeType$1.CIRCLE] = Circle,
+    _a$3[ShapeType$1.DONUT] = Donut,
+    _a$3[ShapeType$1.RECTANGLE] = Rectangle,
+    _a$3[ShapeType$1.EDGE] = Edge,
+    _a$3[ShapeType$1.RECTANGLE_EDGE] = RectangleEdge,
+    _a$3[ShapeType$1.TEXTURE] = TextureShape,
+    _a$3);
 function createShape(shapeOptions) {
     if (!shapeOptions) {
         return new ShapeNone();
@@ -17798,7 +17901,7 @@ var ParticleSystem = /** @class */ (function (_super) {
                                 }));
                                 p.delay += meshTime;
                                 cursor++;
-                                (_a = p.transform).translate.apply(_a, __spreadArray$2([], __read$3(burstOffset), false));
+                                (_a = p.transform).translate.apply(_a, __spreadArray$3([], __read$3(burstOffset), false));
                                 this.addParticle(p, maxCount_1);
                             }
                         }
@@ -18570,7 +18673,9 @@ var TextStyle = /** @class */ (function () {
         this.fontOffset = 0;
         var _g = options.textColor, textColor = _g === void 0 ? [1, 1, 1, 1] : _g, _h = options.fontSize, fontSize = _h === void 0 ? 40 : _h, outline = options.outline, shadow = options.shadow, _j = options.fontWeight, fontWeight = _j === void 0 ? 'normal' : _j, _k = options.fontStyle, fontStyle = _k === void 0 ? 'normal' : _k, _l = options.fontFamily, fontFamily = _l === void 0 ? 'sans-serif' : _l;
         this.textColor = textColor;
+        //@ts-expect-error
         this.textWeight = fontWeight;
+        //@ts-expect-error
         this.fontStyle = fontStyle;
         this.fontFamily = fontFamily;
         this.fontSize = fontSize; // 暂时取消字号限制 Math.min(fontSize, this.maxFontSize);
@@ -20638,7 +20743,10 @@ var VFXItem = /** @class */ (function (_super) {
         try {
             for (var _e = __values$1(this.children), _f = _e.next(); !_f.done; _f = _e.next()) {
                 var child = _f.value;
-                return child.find(name);
+                var res = child.find(name);
+                if (res) {
+                    return res;
+                }
             }
         }
         catch (e_4_1) { e_4 = { error: e_4_1 }; }
@@ -20655,6 +20763,7 @@ var VFXItem = /** @class */ (function (_super) {
         _super.prototype.fromData.call(this, data);
         var id = data.id, name = data.name, delay = data.delay, parentId = data.parentId, endBehavior = data.endBehavior, transform = data.transform, _b = data.listIndex, listIndex = _b === void 0 ? 0 : _b, _c = data.duration, duration = _c === void 0 ? 0 : _c;
         this.props = data;
+        //@ts-expect-error
         this.type = data.type;
         this.id = id.toString(); // TODO 老数据 id 是 number，需要转换
         this.name = name;
@@ -20750,10 +20859,10 @@ var VFXItem = /** @class */ (function (_super) {
     };
     VFXItem.prototype.translateByPixel = function (x, y) {
         if (this.composition) {
+            // @ts-expect-error
+            var _a = this.composition.renderer.canvas.getBoundingClientRect(), width = _a.width, height = _a.height;
             var z = this.transform.getWorldPosition().z;
-            var _a = this.composition.camera.getInverseVPRatio(z), rx = _a.x, ry = _a.y;
-            var width = this.composition.renderer.getWidth() / 2;
-            var height = this.composition.renderer.getHeight() / 2;
+            var _b = this.composition.camera.getInverseVPRatio(z), rx = _b.x, ry = _b.y;
             this.transform.translate(2 * x * rx / width, -2 * y * ry / height, 0);
         }
     };
@@ -20858,7 +20967,6 @@ function createVFXItem(props, composition) {
     if (!pluginName) {
         switch (type) {
             case ItemType$1.null:
-            case ItemType$1.base:
                 pluginName = 'cal';
                 break;
             case ItemType$1.sprite:
@@ -20979,7 +21087,7 @@ var PluginSystem = /** @class */ (function () {
                     plugin = plugins[i];
                     ctrl = pluginLoaderMap[plugin.name];
                     if (name in ctrl) {
-                        pendings.push(Promise.resolve(ctrl[name].apply(ctrl, __spreadArray$2([], __read$3(args), false))));
+                        pendings.push(Promise.resolve(ctrl[name].apply(ctrl, __spreadArray$3([], __read$3(args), false))));
                     }
                 }
                 return [2 /*return*/, Promise.all(pendings)];
@@ -21024,9 +21132,74 @@ function getPluginUsageInfo(name) {
  * Name: @galacean/effects-specification
  * Description: Galacean Effects JSON Specification
  * Author: Ant Group CO., Ltd.
- * Version: v1.0.1
+ * Version: v2.0.0-alpha.2
  */
 
+const randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);
+var native = {
+  randomUUID
+};
+
+// Unique ID creation requires a high quality random # generator. In the browser we therefore
+// require the crypto API and do not support built-in fallback to lower quality random number
+// generators (like Math.random()).
+let getRandomValues;
+const rnds8 = new Uint8Array(16);
+function rng() {
+  // lazy load so that environments that need to polyfill have a chance to do so
+  if (!getRandomValues) {
+    // getRandomValues needs to be invoked in a context where "this" is a Crypto implementation.
+    getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);
+
+    if (!getRandomValues) {
+      throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');
+    }
+  }
+
+  return getRandomValues(rnds8);
+}
+
+/**
+ * Convert array of 16 byte values to UUID string format of the form:
+ * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
+ */
+
+const byteToHex = [];
+
+for (let i = 0; i < 256; ++i) {
+  byteToHex.push((i + 0x100).toString(16).slice(1));
+}
+
+function unsafeStringify(arr, offset = 0) {
+  // Note: Be careful editing this code!  It's been tuned for performance
+  // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434
+  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
+}
+
+function v4(options, buf, offset) {
+  if (native.randomUUID && !buf && !options) {
+    return native.randomUUID();
+  }
+
+  options = options || {};
+  const rnds = options.random || (options.rng || rng)(); // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`
+
+  rnds[6] = rnds[6] & 0x0f | 0x40;
+  rnds[8] = rnds[8] & 0x3f | 0x80; // Copy bytes to buffer, if provided
+
+  if (buf) {
+    offset = offset || 0;
+
+    for (let i = 0; i < 16; ++i) {
+      buf[offset + i] = rnds[i];
+    }
+
+    return buf;
+  }
+
+  return unsafeStringify(rnds);
+}
+
 /*********************************************/
 /*               元素属性参数类型               */
 /*********************************************/
@@ -21289,6 +21462,10 @@ var ItemType;
      * 天空盒元素
      */
     ItemType["skybox"] = "skybox";
+    /**
+     * 特效元素
+     */
+    ItemType["effect"] = "effect";
 })(ItemType || (ItemType = {}));
 /**
  * 渲染模式
@@ -21401,6 +21578,10 @@ var CompositionEndBehavior;
      * 销毁并保留最后一帧
      */
     CompositionEndBehavior[CompositionEndBehavior["pause_destroy"] = END_BEHAVIOR_PAUSE_AND_DESTROY] = "pause_destroy";
+    /**
+     * 冻结
+     */
+    CompositionEndBehavior[CompositionEndBehavior["freeze"] = END_BEHAVIOR_FREEZE] = "freeze";
 })(CompositionEndBehavior || (CompositionEndBehavior = {}));
 
 /*********************************************/
@@ -21537,12 +21718,38 @@ var ShapeArcMode;
     ShapeArcMode[ShapeArcMode["UNIFORM_BURST"] = 3] = "UNIFORM_BURST";
 })(ShapeArcMode || (ShapeArcMode = {}));
 
+var LightType;
+(function (LightType) {
+    /**
+     * 点光源
+     */
+    LightType["point"] = "point";
+    /**
+     * 聚光灯
+     */
+    LightType["spot"] = "spot";
+    /**
+     * 方向光
+     */
+    LightType["directional"] = "directional";
+    /**
+     * 环境光
+     */
+    LightType["ambient"] = "ambient";
+})(LightType || (LightType = {}));
+
 var ModelBoundingType;
 (function (ModelBoundingType) {
     ModelBoundingType[ModelBoundingType["box"] = 2] = "box";
     ModelBoundingType[ModelBoundingType["sphere"] = 3] = "sphere";
 })(ModelBoundingType || (ModelBoundingType = {}));
 
+var CameraType;
+(function (CameraType) {
+    CameraType["orthographic"] = "orthographic";
+    CameraType["perspective"] = "perspective";
+})(CameraType || (CameraType = {}));
+
 // 材质类型
 var MaterialType;
 (function (MaterialType) {
@@ -21688,6 +21895,28 @@ var FontStyle;
     FontStyle["oblique"] = "oblique";
 })(FontStyle || (FontStyle = {}));
 
+var DataType;
+(function (DataType) {
+    DataType["VFXItemData"] = "VFXItemData";
+    DataType["EffectComponent"] = "EffectComponent";
+    DataType["Material"] = "Material";
+    DataType["Shader"] = "Shader";
+    DataType["SpriteComponent"] = "SpriteComponent";
+    DataType["ParticleSystem"] = "ParticleSystem";
+    DataType["InteractComponent"] = "InteractComponent";
+    DataType["CameraController"] = "CameraController";
+    DataType["Geometry"] = "Geometry";
+    DataType["Texture"] = "Texture";
+    DataType["TextComponent"] = "TextComponent";
+    // FIXME: 先完成ECS的场景转换，后面移到spec中
+    DataType["MeshComponent"] = "MeshComponent";
+    DataType["SkyboxComponent"] = "SkyboxComponent";
+    DataType["LightComponent"] = "LightComponent";
+    DataType["CameraComponent"] = "CameraComponent";
+    DataType["ModelPluginComponent"] = "ModelPluginComponent";
+    DataType["TreeComponent"] = "TreeComponent";
+})(DataType || (DataType = {}));
+
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -21743,11 +21972,22 @@ function __read(o, n) {
     return ar;
 }
 
+function __spreadArray(to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+}
+
 typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
     var e = new Error(message);
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
+var _a$2;
 function arrAdd(arr, item) {
     if (!arr.includes(item)) {
         arr.push(item);
@@ -21983,6 +22223,34 @@ function rotationZYXFromQuat(out, quat) {
     }
     return out;
 }
+function generateGUID() {
+    return v4().replace(/-/g, '');
+}
+/**
+ * 提取并转换 JSON 数据中的 anchor 值
+ */
+function convertAnchor$1(anchor, particleOrigin) {
+    if (anchor) {
+        return [anchor[0] - 0.5, 0.5 - anchor[1]];
+    }
+    else if (particleOrigin) {
+        return particleOriginTranslateMap[particleOrigin];
+    }
+    else {
+        return [0, 0];
+    }
+}
+var particleOriginTranslateMap = (_a$2 = {},
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_CENTER] = [0, 0],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_CENTER_BOTTOM] = [0, -0.5],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_CENTER_TOP] = [0, 0.5],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_LEFT_TOP] = [-0.5, 0.5],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_LEFT_CENTER] = [-0.5, 0],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_LEFT_BOTTOM] = [-0.5, -0.5],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_CENTER] = [0.5, 0],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_BOTTOM] = [0.5, -0.5],
+    _a$2[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_TOP] = [0.5, 0.5],
+    _a$2);
 
 function getStandardParticleContent(particle) {
     var _a;
@@ -22394,6 +22662,309 @@ function version22Migration(json) {
     });
     return json;
 }
+/**
+ * 3.0 以下版本数据适配（runtime 2.0及以上版本支持）
+ */
+function version30Migration(json) {
+    var e_1, _a;
+    var _b, _c, _d, _e;
+    var result = Object.assign({}, json, {
+        items: [],
+        components: [],
+        materials: [],
+        shaders: [],
+        geometries: [],
+    });
+    // 兼容老版本数据中不存在textures的情况
+    (_b = result.textures) !== null && _b !== void 0 ? _b : (result.textures = []);
+    result.textures.forEach(function (textureOptions) {
+        Object.assign(textureOptions, {
+            id: generateGUID(),
+            dataType: DataType.Texture,
+        });
+    });
+    if (result.textures.length < result.images.length) {
+        for (var i = result.textures.length; i < result.images.length; i++) {
+            result.textures.push({
+                //@ts-expect-error
+                id: generateGUID(),
+                dataType: DataType.Texture,
+                source: i,
+                flipY: true,
+            });
+        }
+    }
+    var _loop_1 = function (composition) {
+        var e_2, _h, e_3, _j;
+        // composition 的 endbehaviour 兼容
+        if (composition.endBehavior === END_BEHAVIOR_PAUSE_AND_DESTROY || composition.endBehavior === END_BEHAVIOR_PAUSE) {
+            composition.endBehavior = END_BEHAVIOR_FREEZE;
+        }
+        var itemGuidMap = {};
+        try {
+            for (var _k = (e_2 = void 0, __values(composition.items)), _l = _k.next(); !_l.done; _l = _k.next()) {
+                var item = _l.value;
+                itemGuidMap[item.id] = generateGUID();
+                // TODO: 编辑器测试用，上线后删除
+                //@ts-expect-error
+                item.oldId = item.id;
+                item.id = itemGuidMap[item.id];
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (_l && !_l.done && (_h = _k.return)) _h.call(_k);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+        composition.items.forEach(function (item, index) {
+            if (item.parentId) {
+                if (item.parentId.includes('^')) {
+                    var parentId = (item.parentId).split('^')[0];
+                    var nodeId = (item.parentId).split('^')[1];
+                    item.parentId = itemGuidMap[parentId] + '^' + nodeId;
+                }
+                else {
+                    item.parentId = itemGuidMap[item.parentId];
+                }
+            }
+            // @ts-expect-error fix item type
+            result.items.push(item);
+            // @ts-expect-error fix item type
+            composition.items[index] = { id: item.id };
+        });
+        try {
+            for (var _m = (e_3 = void 0, __values(result.items)), _o = _m.next(); !_o.done; _o = _m.next()) {
+                var item = _o.value;
+                // 原 texture 索引转为统一 guid 索引
+                if (item.content) {
+                    if (item.content.renderer) {
+                        if (item.content.renderer.texture !== undefined) {
+                            var oldTextureId = item.content.renderer.texture;
+                            //@ts-expect-error
+                            item.content.renderer.texture = { id: result.textures[oldTextureId].id };
+                        }
+                    }
+                    if (item.content.trails) {
+                        if (item.content.trails.texture !== undefined) {
+                            var oldTextureId = item.content.trails.texture;
+                            //@ts-expect-error
+                            item.content.trails.texture = { id: result.textures[oldTextureId].id };
+                        }
+                    }
+                }
+                // item 的 transform 属性由数组转为 {x:n, y:n, z:n}
+                if (item.transform) {
+                    //@ts-expect-error
+                    var position = __spreadArray([], __read((_c = item.transform.position) !== null && _c !== void 0 ? _c : [0, 0, 0]), false);
+                    //@ts-expect-error
+                    var rotation = __spreadArray([], __read((_d = item.transform.rotation) !== null && _d !== void 0 ? _d : [0, 0, 0]), false);
+                    //@ts-expect-error
+                    var scale = __spreadArray([], __read((_e = item.transform.scale) !== null && _e !== void 0 ? _e : [1, 1, 1]), false);
+                    Object.assign(item, {
+                        transform: {
+                            position: { x: position[0], y: position[1], z: position[2] },
+                            rotation: { x: rotation[0], y: rotation[1], z: rotation[2] },
+                            scale: { x: scale[0], y: scale[1], z: scale[0] },
+                        },
+                    });
+                    // sprite 的 scale 转为 size
+                    if (item.type === ItemType.sprite) {
+                        item.transform.size = { x: scale[0], y: scale[1] };
+                        item.transform.scale = { x: 1, y: 1, z: 1 };
+                    }
+                    // sprite 的 anchor 修正
+                    if (item.type === ItemType.sprite) {
+                        var content = item.content;
+                        if (!content.renderer) {
+                            content.renderer = {};
+                        }
+                        var renderer = content.renderer;
+                        var realAnchor = convertAnchor$1(renderer.anchor, renderer.particleOrigin);
+                        var startSize = item.transform.size;
+                        // 兼容旧JSON（anchor和particleOrigin可能同时存在）
+                        if (!renderer.anchor && renderer.particleOrigin !== undefined) {
+                            //@ts-expect-error
+                            item.transform.position.x += -realAnchor[0] * startSize.x;
+                            //@ts-expect-error
+                            item.transform.position.y += -realAnchor[1] * startSize.y;
+                        }
+                        //@ts-expect-error
+                        item.transform.anchor = { x: realAnchor[0] * startSize.x, y: realAnchor[1] * startSize.y };
+                    }
+                }
+                if (item.type === ItemType.particle) {
+                    var content = item.content;
+                    if (!content.renderer) {
+                        content.renderer = {};
+                    }
+                    var renderer = content.renderer;
+                    content.renderer.anchor = convertAnchor$1(renderer.anchor, renderer.particleOrigin);
+                }
+                // 动画数据转化 TODO: 动画数据移到 TimelineComponentData
+                item.content.tracks = [];
+                var tracks = item.content.tracks;
+                if (item.type !== ItemType.particle) {
+                    tracks.push({
+                        clips: [
+                            {
+                                dataType: 'TransformAnimationPlayableAsset',
+                                animationClip: {
+                                    sizeOverLifetime: item.content.sizeOverLifetime,
+                                    rotationOverLifetime: item.content.rotationOverLifetime,
+                                    positionOverLifetime: item.content.positionOverLifetime,
+                                },
+                            },
+                        ],
+                    });
+                }
+                if (item.type === ItemType.sprite) {
+                    tracks.push({
+                        clips: [
+                            {
+                                dataType: 'SpriteColorAnimationPlayableAsset',
+                                animationClip: {
+                                    colorOverLifetime: item.content.colorOverLifetime,
+                                    startColor: item.content.options.startColor,
+                                },
+                            },
+                        ],
+                    });
+                }
+                // gizmo 的 target id 转换为新的 item guid
+                if (item.content.options.target) {
+                    item.content.options.target = itemGuidMap[item.content.options.target];
+                }
+                // item 的 content 转为 component data 加入 JSONScene.components
+                var uuid = generateGUID();
+                if (item.type === ItemType.sprite) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.SpriteComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.particle) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.ParticleSystem;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.mesh) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.MeshComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.skybox) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.SkyboxComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.light) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.LightComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === 'camera') {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.CameraComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.tree) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.TreeComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.interact) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.InteractComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.camera) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.CameraController;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+                else if (item.type === ItemType.text) {
+                    item.components = [];
+                    result.components.push(item.content);
+                    item.content.id = uuid;
+                    item.content.dataType = DataType.TextComponent;
+                    item.content.item = { id: item.id };
+                    item.dataType = DataType.VFXItemData;
+                    //@ts-expect-error
+                    item.components.push({ id: item.content.id });
+                }
+            }
+        }
+        catch (e_3_1) { e_3 = { error: e_3_1 }; }
+        finally {
+            try {
+                if (_o && !_o.done && (_j = _m.return)) _j.call(_m);
+            }
+            finally { if (e_3) throw e_3.error; }
+        }
+    };
+    try {
+        // 更正Composition.endBehavior
+        for (var _f = __values(json.compositions), _g = _f.next(); !_g.done; _g = _f.next()) {
+            var composition = _g.value;
+            _loop_1(composition);
+        }
+    }
+    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+    finally {
+        try {
+            if (_g && !_g.done && (_a = _f.return)) _a.call(_f);
+        }
+        finally { if (e_1) throw e_1.error; }
+    }
+    result.version = '3.0';
+    return result;
+}
 
 var v0 = /^(\d+)\.(\d+)\.(\d+)(-(\w+)\.\d+)?$/;
 var standardVersion = /^(\d+)\.(\d+)$/;
@@ -22403,16 +22974,16 @@ function getStandardJSON(json) {
     if (!json || typeof json !== 'object') {
         throw Error('expect a json object');
     }
-    // 修正老版本数据中，meshItem以及lightItem结束行为错误问题
+    // 修正老版本数据中，meshItem 以及 lightItem 结束行为错误问题
     version22Migration(json);
     if (v0.test(json.version)) {
         reverseParticle = ((_a = (/^(\d+)/).exec(json.version)) === null || _a === void 0 ? void 0 : _a[0]) === '0';
-        return version21Migration(getStandardJSONFromV0(json));
+        return version30Migration(version21Migration(getStandardJSONFromV0(json)));
     }
     var mainVersion = (_b = standardVersion.exec(json.version)) === null || _b === void 0 ? void 0 : _b[1];
     if (mainVersion) {
-        if (Number(mainVersion) < 2) {
-            return version21Migration(json);
+        if (Number(mainVersion) < 3) {
+            return version30Migration(version21Migration(json));
         }
         return json;
     }
@@ -22736,7 +23307,7 @@ function version3Migration(scene) {
     try {
         for (var _j = __values$1(ecScene.items), _k = _j.next(); !_k.done; _k = _j.next()) {
             var item = _k.value;
-            itemGuidMap[item.id] = generateGUID();
+            itemGuidMap[item.id] = generateGUID$1();
             // TODO: 编辑器测试用，上线后删除
             //@ts-expect-error
             item.oldId = item.id;
@@ -22792,7 +23363,7 @@ function version3Migration(scene) {
         // texture 增加 id 和 dataType
         for (var _q = __values$1(scene.textureOptions), _r = _q.next(); !_r.done; _r = _q.next()) {
             var texture = _r.value;
-            texture.id = generateGUID();
+            texture.id = generateGUID$1();
             texture.dataType = exports.DataType.Texture;
         }
     }
@@ -22812,23 +23383,15 @@ function version3Migration(scene) {
             var item = _t.value;
             // 原 texture 索引转为统一 guid 索引
             if (item.content) {
-                //@ts-expect-error
                 if (item.content.renderer) {
-                    //@ts-expect-error
                     if (item.content.renderer.texture !== undefined) {
-                        //@ts-expect-error
                         var oldTextureId = item.content.renderer.texture;
-                        //@ts-expect-error
                         item.content.renderer.texture = { id: scene.textureOptions[oldTextureId].id };
                     }
                 }
-                //@ts-expect-error
                 if (item.content.trails) {
-                    //@ts-expect-error
                     if (item.content.trails.texture !== undefined) {
-                        //@ts-expect-error
                         var oldTextureId = item.content.trails.texture;
-                        //@ts-expect-error
                         item.content.trails.texture = { id: scene.textureOptions[oldTextureId].id };
                     }
                 }
@@ -22839,12 +23402,14 @@ function version3Migration(scene) {
                 var rotation = item.transform.rotation;
                 var scale = item.transform.scale;
                 if (!position) {
+                    //@ts-expect-error
                     position = [0, 0, 0];
                 }
                 if (!rotation) {
                     rotation = [0, 0, 0];
                 }
                 if (!scale) {
+                    //@ts-expect-error
                     scale = [1, 1, 1];
                 }
                 item.transform = {
@@ -22865,12 +23430,9 @@ function version3Migration(scene) {
                 // sprite 的 anchor 修正
                 if (item.type === ItemType$1.sprite) {
                     var content = item.content;
-                    //@ts-expect-error
                     if (!content.renderer) {
-                        //@ts-expect-error
                         content.renderer = {};
                     }
-                    //@ts-expect-error
                     var renderer = content.renderer;
                     var realAnchor = convertAnchor(renderer.anchor, renderer.particleOrigin);
                     //@ts-expect-error
@@ -22888,14 +23450,10 @@ function version3Migration(scene) {
             }
             if (item.type === ItemType$1.particle) {
                 var content = item.content;
-                //@ts-expect-error
                 if (!content.renderer) {
-                    //@ts-expect-error
                     content.renderer = {};
                 }
-                //@ts-expect-error
                 var renderer = content.renderer;
-                //@ts-expect-error
                 content.renderer.anchor = convertAnchor(renderer.anchor, renderer.particleOrigin);
             }
             // item 的 endbehaviour 兼容
@@ -22904,9 +23462,7 @@ function version3Migration(scene) {
                 item.endBehavior = END_BEHAVIOR_FREEZE$1;
             }
             // 动画数据转化 TODO: 动画数据移到 TimelineComponentData
-            //@ts-expect-error
             item.content.tracks = [];
-            //@ts-expect-error
             var tracks = item.content.tracks;
             if (item.type !== ItemType$1.particle) {
                 tracks.push({
@@ -22914,11 +23470,8 @@ function version3Migration(scene) {
                         {
                             dataType: 'TransformAnimationPlayableAsset',
                             animationClip: {
-                                //@ts-expect-error
                                 sizeOverLifetime: item.content.sizeOverLifetime,
-                                //@ts-expect-error
                                 rotationOverLifetime: item.content.rotationOverLifetime,
-                                //@ts-expect-error
                                 positionOverLifetime: item.content.positionOverLifetime,
                             },
                         },
@@ -22931,9 +23484,7 @@ function version3Migration(scene) {
                         {
                             dataType: 'SpriteColorAnimationPlayableAsset',
                             animationClip: {
-                                //@ts-expect-error
                                 colorOverLifetime: item.content.colorOverLifetime,
-                                //@ts-expect-error
                                 startColor: item.content.options.startColor,
                             },
                         },
@@ -22941,169 +23492,107 @@ function version3Migration(scene) {
                 });
             }
             // gizmo 的 target id 转换为新的 item guid
-            //@ts-expect-error
-            if (item.content.options.target) {
-                //@ts-expect-error
+            if (item.content && item.content.options && item.content.options.target) {
                 item.content.options.target = itemGuidMap[item.content.options.target];
             }
             // item 的 content 转为 component data 加入 JSONScene.components
-            var uuid = v4().replace(/-/g, '');
+            var uuid = v4$1().replace(/-/g, '');
             if (item.type === ItemType$1.sprite) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.SpriteComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.particle) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.ParticleSystem;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.mesh) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.MeshComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.skybox) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.SkyboxComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.light) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.LightComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === 'camera') {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.CameraComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.tree) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.TreeComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.interact) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.InteractComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.camera) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.CameraController;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
             }
             else if (item.type === ItemType$1.text) {
-                //@ts-expect-error
                 item.components = [];
-                //@ts-expect-error
                 components.push(item.content);
-                //@ts-expect-error
                 item.content.id = uuid;
-                //@ts-expect-error
                 item.content.dataType = exports.DataType.TextComponent;
-                //@ts-expect-error
                 item.content.item = { id: item.id };
-                //@ts-expect-error
                 item.dataType = exports.DataType.VFXItemData;
                 //@ts-expect-error
                 item.components.push({ id: item.content.id });
@@ -23127,7 +23616,7 @@ function convertAnchor(anchor, particleOrigin) {
         return [anchor[0] - 0.5, 0.5 - anchor[1]];
     }
     else if (particleOrigin) {
-        return particleOriginTranslateMap[particleOrigin];
+        return particleOriginTranslateMap$1[particleOrigin];
     }
     else {
         return [0, 0];
@@ -23405,16 +23894,17 @@ var AssetManager = /** @class */ (function () {
     };
     AssetManager.prototype.processBins = function (bins) {
         return __awaiter(this, void 0, void 0, function () {
-            var renderLevel, jobs;
+            var renderLevel, baseUrl, jobs;
             var _this = this;
             return __generator(this, function (_a) {
                 renderLevel = this.options.renderLevel;
+                baseUrl = this.baseUrl;
                 jobs = bins.map(function (bin) {
                     if (bin instanceof ArrayBuffer) {
                         return bin;
                     }
                     if (passRenderLevel(bin.renderLevel, renderLevel)) {
-                        return _this.loadBins(bin.url);
+                        return _this.loadBins(new URL(bin.url, baseUrl).href);
                     }
                     throw new Error("Invalid bins source: ".concat(JSON.stringify(bins)));
                 });
@@ -23432,13 +23922,14 @@ var AssetManager = /** @class */ (function () {
                     return [2 /*return*/];
                 }
                 jobs = fonts.map(function (font) { return __awaiter(_this, void 0, void 0, function () {
-                    var fontFace;
+                    var url, fontFace;
                     var _a;
                     return __generator(this, function (_b) {
                         switch (_b.label) {
                             case 0:
                                 if (!(font.fontURL && !AssetManager.fonts.has(font.fontFamily))) return [3 /*break*/, 4];
-                                fontFace = new FontFace((_a = font.fontFamily) !== null && _a !== void 0 ? _a : '', 'url(' + font.fontURL + ')');
+                                url = new URL(font.fontURL, this.baseUrl).href;
+                                fontFace = new FontFace((_a = font.fontFamily) !== null && _a !== void 0 ? _a : '', 'url(' + url + ')');
                                 _b.label = 1;
                             case 1:
                                 _b.trys.push([1, 3, , 4]);
@@ -23451,7 +23942,7 @@ var AssetManager = /** @class */ (function () {
                                 return [3 /*break*/, 4];
                             case 3:
                                 _b.sent();
-                                logger.warn("Invalid fonts source: ".concat(JSON.stringify(font.fontURL)));
+                                logger.warn("Invalid fonts source: ".concat(JSON.stringify(url)));
                                 return [3 /*break*/, 4];
                             case 4: return [2 /*return*/];
                         }
@@ -23700,7 +24191,7 @@ function createTextureOptionsBySource(image, sourceFrom) {
         return image.source;
     }
     else if (image instanceof HTMLImageElement ||
-        image instanceof HTMLCanvasElement) {
+        isCanvas(image)) {
         return {
             image: image,
             sourceType: exports.TextureSourceType.image,
@@ -23762,6 +24253,11 @@ function base64ToFile(base64, filename, contentType) {
     var file = new File([blob], filename, { type: contentType });
     return file;
 }
+function isCanvas(cavnas) {
+    var _a;
+    // 小程序 Canvas 无法使用 instanceof HTMLCanvasElement 判断
+    return typeof cavnas === 'object' && cavnas !== null && ((_a = cavnas.tagName) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === 'CANVAS';
+}
 
 var tmpScale = new Vector3(1, 1, 1);
 /**
@@ -23981,8 +24477,9 @@ var Camera = /** @class */ (function () {
     Camera.prototype.getInverseVPRatio = function (z) {
         var pos = new Vector3(0, 0, z);
         var mat = this.getViewProjectionMatrix();
-        var nz = pos.applyMatrix(mat).z;
-        return new Vector3(1, 1, nz).applyMatrix(mat);
+        var inverseVP = this.getInverseViewProjectionMatrix();
+        var nz = mat.projectPoint(pos).z;
+        return inverseVP.projectPoint(new Vector3(1, 1, nz));
     };
     /**
      * 设置相机的旋转四元数
@@ -23994,7 +24491,6 @@ var Camera = /** @class */ (function () {
             this.dirty = true;
         }
         else {
-            this.options.quat;
             if (!this.options.quat.equals(value)) {
                 this.options.quat.copyFrom(value);
                 this.dirty = true;
@@ -24162,8 +24658,7 @@ var CompositionComponent = /** @class */ (function (_super) {
                     }
                     item.getComponent(CompositionComponent).createContent();
                 }
-                else if (itemData.type === 'ECS' ||
-                    itemData.type === ItemType$1.sprite ||
+                else if (itemData.type === ItemType$1.sprite ||
                     itemData.type === ItemType$1.text ||
                     itemData.type === ItemType$1.particle ||
                     itemData.type === ItemType$1.mesh ||
@@ -24181,20 +24676,7 @@ var CompositionComponent = /** @class */ (function (_super) {
                     item = new VFXItem(this.engine, itemData);
                     item.composition = this.item.composition;
                     // 兼容老的数据代码，json 更新后可移除
-                    switch (itemData.type) {
-                        case ItemType$1.text: {
-                            // 添加文本组件
-                            var textItem = new TextComponent(this.engine, itemData.content);
-                            textItem.item = item;
-                            item.components.push(textItem);
-                            item.rendererComponents.push(textItem);
-                            item._content = textItem;
-                            break;
-                        }
-                        default: {
-                            item = createVFXItem(itemData, this.item.composition);
-                        }
-                    }
+                    item = createVFXItem(itemData, this.item.composition);
                 }
                 item.parent = this.item;
                 // 相机不跟随合成移动
@@ -25584,10 +26066,8 @@ var Engine = /** @class */ (function () {
     Engine.prototype.addPackageDatas = function (scene) {
         var e_1, _a, e_2, _b, e_3, _c, e_4, _d, e_5, _e, e_6, _f;
         var jsonScene = scene.jsonScene;
-        //@ts-expect-error
         if (jsonScene.items) {
             try {
-                //@ts-expect-error
                 for (var _g = __values$1(jsonScene.items), _h = _g.next(); !_h.done; _h = _g.next()) {
                     var vfxItemData = _h.value;
                     this.addEffectsObjectData(vfxItemData);
@@ -25601,10 +26081,8 @@ var Engine = /** @class */ (function () {
                 finally { if (e_1) throw e_1.error; }
             }
         }
-        //@ts-expect-error
         if (jsonScene.materials) {
             try {
-                //@ts-expect-error
                 for (var _j = __values$1(jsonScene.materials), _k = _j.next(); !_k.done; _k = _j.next()) {
                     var materialData = _k.value;
                     this.addEffectsObjectData(materialData);
@@ -25618,10 +26096,8 @@ var Engine = /** @class */ (function () {
                 finally { if (e_2) throw e_2.error; }
             }
         }
-        //@ts-expect-error
         if (jsonScene.shaders) {
             try {
-                //@ts-expect-error
                 for (var _l = __values$1(jsonScene.shaders), _m = _l.next(); !_m.done; _m = _l.next()) {
                     var shaderData = _m.value;
                     this.addEffectsObjectData(shaderData);
@@ -25635,10 +26111,8 @@ var Engine = /** @class */ (function () {
                 finally { if (e_3) throw e_3.error; }
             }
         }
-        //@ts-expect-error
         if (jsonScene.geometries) {
             try {
-                //@ts-expect-error
                 for (var _o = __values$1(jsonScene.geometries), _p = _o.next(); !_p.done; _p = _o.next()) {
                     var geometryData = _p.value;
                     this.addEffectsObjectData(geometryData);
@@ -25652,10 +26126,8 @@ var Engine = /** @class */ (function () {
                 finally { if (e_4) throw e_4.error; }
             }
         }
-        //@ts-expect-error
         if (jsonScene.components) {
             try {
-                //@ts-expect-error
                 for (var _q = __values$1(jsonScene.components), _r = _q.next(); !_r.done; _r = _q.next()) {
                     var componentData = _r.value;
                     this.addEffectsObjectData(componentData);
@@ -26580,13 +27052,13 @@ var ThreeMaterial = /** @class */ (function (_super) {
         this.uniforms[name] = this.material.uniforms[name] = uniform;
     };
     // 下列三个方法暂时不需要实现
-    ThreeMaterial.prototype.enableKeyword = function (keyword) {
+    ThreeMaterial.prototype.enableMacro = function (keyword) {
         throw new Error('Method not implemented.');
     };
-    ThreeMaterial.prototype.disableKeyword = function (keyword) {
+    ThreeMaterial.prototype.disableMacro = function (keyword) {
         throw new Error('Method not implemented.');
     };
-    ThreeMaterial.prototype.isKeywordEnabled = function (keyword) {
+    ThreeMaterial.prototype.isMacroEnabled = function (keyword) {
         throw new Error('Method not implemented.');
     };
     ThreeMaterial.prototype.clone = function (props) {
@@ -27644,7 +28116,7 @@ Geometry.create = function (engine, options) {
 Mesh.create = function (engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.0.0-alpha.3";
+var version = "2.0.0-alpha.4";
 logger.info('THREEJS plugin version: ' + version);
 
 exports.AbstractPlugin = AbstractPlugin;
@@ -27737,6 +28209,7 @@ exports.SPRITE_VERTEX_STRIDE = SPRITE_VERTEX_STRIDE;
 exports.SemanticMap = SemanticMap;
 exports.SerializationHelper = SerializationHelper;
 exports.Shader = Shader;
+exports.ShaderVariant = ShaderVariant;
 exports.SpriteColorPlayable = SpriteColorPlayable;
 exports.SpriteComponent = SpriteComponent;
 exports.SpriteLoader = SpriteLoader;
@@ -27813,7 +28286,7 @@ exports.gaussianDownHFrag = gaussianDownHFrag;
 exports.gaussianDownVFrag = gaussianDownVFrag;
 exports.gaussianUpFrag = gaussianUpFrag;
 exports.generateEmptyTypedArray = generateEmptyTypedArray;
-exports.generateGUID = generateGUID;
+exports.generateGUID = generateGUID$1;
 exports.generateHalfFloatTexture = generateHalfFloatTexture;
 exports.getBackgroundImage = getBackgroundImage;
 exports.getColorFromGradientStops = getColorFromGradientStops;
@@ -27870,7 +28343,7 @@ exports.nearestPowerOfTwo = nearestPowerOfTwo;
 exports.noop = noop;
 exports.parsePercent = parsePercent$1;
 exports.particleFrag = particleFrag;
-exports.particleOriginTranslateMap = particleOriginTranslateMap;
+exports.particleOriginTranslateMap = particleOriginTranslateMap$1;
 exports.particleVert = particleVert;
 exports.pluginLoaderMap = pluginLoaderMap;
 exports.random = random;