@galacean/effects-threejs 2.1.0-alpha.9 → 2.1.0-beta.0

package/dist/index.mjs

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.1.0-alpha.9
+ * Version: v2.1.0-beta.0
  */
 
 import * as THREE from 'three';
@@ -1220,6 +1220,12 @@ function _inherits(subClass, superClass) {
     /**
      * 特效元素
      */ ItemType["effect"] = "effect";
+    /**
+     * 形状元素
+     */ ItemType["shape"] = "shape";
+    /**
+     * 后处理元素
+     */ ItemType["postProcessVolume"] = "postProcessVolume";
     /**
      * 节点元素
      */ ItemType["node"] = "node";
@@ -1229,6 +1235,9 @@ function _inherits(subClass, superClass) {
     /**
      * 音频元素
      */ ItemType["audio"] = "audio";
+    /**
+     * 富文本元素
+     */ ItemType["richtext"] = "richtext";
 })(ItemType || (ItemType = {}));
 /**
  * 渲染模式
@@ -1604,6 +1613,30 @@ var TextAlignment;
      */ FontStyle["oblique"] = "oblique";
 })(FontStyle || (FontStyle = {}));
 
+var BuiltinObjectGUID = {
+    WhiteTexture: "whitetexture00000000000000000000",
+    TransparentTexture: "transparenttexture00000000000000000000",
+    PBRShader: "pbr00000000000000000000000000000",
+    UnlitShader: "unlit000000000000000000000000000"
+};
+
+/**
+ * 动态换图类型
+ * @since 1.1.0
+ */ var BackgroundType;
+(function(BackgroundType) {
+    BackgroundType["video"] = "video";
+    BackgroundType["image"] = "image";
+})(BackgroundType || (BackgroundType = {}));
+/**
+ * 多媒体资源类型
+ * @since 2.1.0
+ */ var MultimediaType;
+(function(MultimediaType) {
+    MultimediaType["video"] = "video";
+    MultimediaType["audio"] = "audio";
+})(MultimediaType || (MultimediaType = {}));
+
 var DataType;
 (function(DataType) {
     DataType["VFXItemData"] = "VFXItemData";
@@ -1614,6 +1647,7 @@ var DataType;
     DataType["ParticleSystem"] = "ParticleSystem";
     DataType["InteractComponent"] = "InteractComponent";
     DataType["CameraController"] = "CameraController";
+    DataType["PostProcessVolume"] = "PostProcessVolume";
     DataType["Geometry"] = "Geometry";
     DataType["Texture"] = "Texture";
     DataType["AnimationClip"] = "AnimationClip";
@@ -1636,7 +1670,6 @@ var DataType;
     DataType["SubCompositionPlayableAsset"] = "SubCompositionPlayableAsset";
     DataType["FloatPropertyPlayableAsset"] = "FloatPropertyPlayableAsset";
     DataType["ColorPropertyPlayableAsset"] = "ColorPropertyPlayableAsset";
-    // FIXME: 先完成ECS的场景转换，后面移到spec中
     DataType["MeshComponent"] = "MeshComponent";
     DataType["SkyboxComponent"] = "SkyboxComponent";
     DataType["LightComponent"] = "LightComponent";
@@ -1647,9 +1680,11 @@ var DataType;
     DataType["SpineComponent"] = "SpineComponent";
     DataType["VideoComponent"] = "VideoComponent";
     DataType["AudioComponent"] = "AudioComponent";
+    DataType["RichTextComponent"] = "RichTextComponent";
     // Non-EffectObject
     DataType["TimelineClip"] = "TimelineClip";
 })(DataType || (DataType = {}));
+
 var GeometryType;
 (function(GeometryType) {
     /**
@@ -1734,30 +1769,6 @@ var VertexBufferSemantic;
     VertexBufferSemantic["TangentBS3"] = "TANGENT_BS3";
 })(VertexBufferSemantic || (VertexBufferSemantic = {}));
 
-var BuiltinObjectGUID = {
-    WhiteTexture: "whitetexture00000000000000000000",
-    TransparentTexture: "transparenttexture00000000000000000000",
-    PBRShader: "pbr00000000000000000000000000000",
-    UnlitShader: "unlit000000000000000000000000000"
-};
-
-/**
- * 动态换图类型
- * @since 1.1.0
- */ var BackgroundType;
-(function(BackgroundType) {
-    BackgroundType["video"] = "video";
-    BackgroundType["image"] = "image";
-})(BackgroundType || (BackgroundType = {}));
-/**
- * 多媒体资源类型
- * @since 2.1.0
- */ var MultimediaType;
-(function(MultimediaType) {
-    MultimediaType["video"] = "video";
-    MultimediaType["audio"] = "audio";
-})(MultimediaType || (MultimediaType = {}));
-
 var index$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     get RenderLevel () { return RenderLevel; },
@@ -1802,14 +1813,14 @@ var index$1 = /*#__PURE__*/Object.freeze({
     get TextAlignment () { return TextAlignment; },
     get TextWeight () { return TextWeight; },
     get FontStyle () { return FontStyle; },
+    BuiltinObjectGUID: BuiltinObjectGUID,
+    get BackgroundType () { return BackgroundType; },
+    get MultimediaType () { return MultimediaType; },
     get DataType () { return DataType; },
     get GeometryType () { return GeometryType; },
     get VertexFormatType () { return VertexFormatType; },
     get IndexFormatType () { return IndexFormatType; },
-    get VertexBufferSemantic () { return VertexBufferSemantic; },
-    BuiltinObjectGUID: BuiltinObjectGUID,
-    get BackgroundType () { return BackgroundType; },
-    get MultimediaType () { return MultimediaType; }
+    get VertexBufferSemantic () { return VertexBufferSemantic; }
 });
 
 function _defineProperties(target, props) {
@@ -1897,15 +1908,23 @@ function getDirectStore(target) {
         this.engine.addInstance(this);
     }
     var _proto = EffectsObject.prototype;
-    _proto.getInstanceId = function getInstanceId() {
+    /**
+   *
+   * @returns
+   */ _proto.getInstanceId = function getInstanceId() {
         return this.guid;
     };
-    _proto.setInstanceId = function setInstanceId(guid) {
+    /**
+   *
+   * @param guid
+   */ _proto.setInstanceId = function setInstanceId(guid) {
         this.engine.removeInstance(this.guid);
         this.guid = guid;
         this.engine.addInstance(this);
     };
-    _proto.toData = function toData() {};
+    /**
+   *
+   */ _proto.toData = function toData() {};
     /**
    * 反序列化函数
    *
@@ -1915,8 +1934,14 @@ function getDirectStore(target) {
             this.setInstanceId(data.id);
         }
     };
-    _proto.dispose = function dispose() {};
-    EffectsObject.is = function is(obj) {
+    /**
+   *
+   */ _proto.dispose = function dispose() {};
+    /**
+   *
+   * @param obj
+   * @returns
+   */ EffectsObject.is = function is(obj) {
         return _instanceof1(obj, EffectsObject) && "guid" in obj;
     };
     return EffectsObject;
@@ -1996,7 +2021,7 @@ function getDirectStore(target) {
                 this.onAwake();
                 this.isAwakeCalled = true;
             }
-            if (item.getVisible() && this.enabled) {
+            if (item.isActive && this.enabled) {
                 this.start();
                 this.enable();
             }
@@ -2041,7 +2066,7 @@ function getDirectStore(target) {
             get: /**
    * 组件是否可以更新，true 更新，false 不更新
    */ function get() {
-                return this.item.getVisible() && this.enabled;
+                return this.item.isActive && this.enabled;
             }
         },
         {
@@ -3670,7 +3695,9 @@ Vector3.ZERO = new Vector3(0.0, 0.0, 0.0);
      */ Vector4.ONE = new Vector4(1.0, 1.0, 1.0, 1.0);
 Vector4.ZERO = new Vector4(0.0, 0.0, 0.0, 0.0);
 
-var MeshComponent = /*#__PURE__*/ function(RendererComponent) {
+/**
+ * Mesh 组件
+ */ var MeshComponent = /*#__PURE__*/ function(RendererComponent) {
     _inherits(MeshComponent, RendererComponent);
     function MeshComponent() {
         var _this;
@@ -3680,7 +3707,9 @@ var MeshComponent = /*#__PURE__*/ function(RendererComponent) {
    */ _this.meshCollider = new MeshCollider();
         // TODO 点击测试后续抽象一个 Collider 组件
         _this.getHitTestParams = function(force) {
-            var area = _this.getBoundingBox();
+            var worldMatrix = _this.transform.getWorldMatrix();
+            _this.meshCollider.setGeometry(_this.geometry, worldMatrix);
+            var area = _this.meshCollider.getBoundingBoxData();
             if (area) {
                 return {
                     type: area.type,
@@ -3700,8 +3729,8 @@ var MeshComponent = /*#__PURE__*/ function(RendererComponent) {
     _proto.getBoundingBox = function getBoundingBox() {
         var worldMatrix = this.transform.getWorldMatrix();
         this.meshCollider.setGeometry(this.geometry, worldMatrix);
-        var boundingBoxData = this.meshCollider.getBoundingBoxData();
-        return boundingBoxData;
+        var boundingBox = this.meshCollider.getBoundingBox();
+        return boundingBox;
     };
     return MeshComponent;
 }(RendererComponent);
@@ -3739,24 +3768,29 @@ EffectComponent = __decorate([
 
 var PostProcessVolume = /*#__PURE__*/ function(Behaviour) {
     _inherits(PostProcessVolume, Behaviour);
-    function PostProcessVolume() {
+    function PostProcessVolume(engine) {
         var _this;
-        _this = Behaviour.apply(this, arguments) || this;
-        // Bloom
-        _this.bloomEnabled = true;
-        _this.threshold = 1.0;
-        _this.bloomIntensity = 1.0;
-        // ColorAdjustments
-        _this.brightness = 1.0;
-        _this.saturation = 1.0;
-        _this.contrast = 1.0;
-        // Vignette
-        _this.vignetteIntensity = 0.2;
-        _this.vignetteSmoothness = 0.4;
-        _this.vignetteRoundness = 1.0;
-        // ToneMapping
-        _this.toneMappingEnabled = true // 1: true, 0: false
-        ;
+        _this = Behaviour.call(this, engine) || this;
+        _this.bloom = {
+            threshold: 0,
+            intensity: 0,
+            active: false
+        };
+        _this.vignette = {
+            intensity: 0,
+            smoothness: 0,
+            roundness: 0,
+            active: false
+        };
+        _this.tonemapping = {
+            active: false
+        };
+        _this.colorAdjustments = {
+            brightness: 0,
+            saturation: 0,
+            contrast: 0,
+            active: false
+        };
         return _this;
     }
     var _proto = PostProcessVolume.prototype;
@@ -3770,36 +3804,18 @@ var PostProcessVolume = /*#__PURE__*/ function(Behaviour) {
 }(Behaviour);
 __decorate([
     serialize()
-], PostProcessVolume.prototype, "bloomEnabled", void 0);
-__decorate([
-    serialize()
-], PostProcessVolume.prototype, "threshold", void 0);
+], PostProcessVolume.prototype, "bloom", void 0);
 __decorate([
     serialize()
-], PostProcessVolume.prototype, "bloomIntensity", void 0);
+], PostProcessVolume.prototype, "vignette", void 0);
 __decorate([
     serialize()
-], PostProcessVolume.prototype, "brightness", void 0);
+], PostProcessVolume.prototype, "tonemapping", void 0);
 __decorate([
     serialize()
-], PostProcessVolume.prototype, "saturation", void 0);
-__decorate([
-    serialize()
-], PostProcessVolume.prototype, "contrast", void 0);
-__decorate([
-    serialize()
-], PostProcessVolume.prototype, "vignetteIntensity", void 0);
-__decorate([
-    serialize()
-], PostProcessVolume.prototype, "vignetteSmoothness", void 0);
-__decorate([
-    serialize()
-], PostProcessVolume.prototype, "vignetteRoundness", void 0);
-__decorate([
-    serialize()
-], PostProcessVolume.prototype, "toneMappingEnabled", void 0);
+], PostProcessVolume.prototype, "colorAdjustments", void 0);
 PostProcessVolume = __decorate([
-    effectsClass("PostProcessVolume")
+    effectsClass(DataType.PostProcessVolume)
 ], PostProcessVolume);
 
 function _assert_this_initialized(self) {
@@ -6886,6 +6902,7 @@ var MaterialRenderType;
         _this.enabledMacros = {};
         _this.destroyed = false;
         _this.initialized = false;
+        _this.shaderDirty = true;
         if (props) {
             var _props_name = props.name, name = _props_name === void 0 ? "Material" + seed$9++ : _props_name, _props_renderType = props.renderType, renderType = _props_renderType === void 0 ? 0 : _props_renderType, shader = props.shader, uniformSemantics = props.uniformSemantics;
             _this.name = name;
@@ -6913,6 +6930,41 @@ var MaterialRenderType;
     // OVERRIDE
     };
     _create_class(Material, [
+        {
+            key: "shader",
+            get: function get() {
+                return this._shader;
+            },
+            set: function set(value) {
+                if (this._shader === value) {
+                    return;
+                }
+                this._shader = value;
+                this.shaderDirty = true;
+            }
+        },
+        {
+            key: "mainTexture",
+            get: /**
+   * 材质的主纹理
+   */ function get() {
+                return this.getTexture("_MainTex");
+            },
+            set: function set(value) {
+                this.setTexture("_MainTex", value);
+            }
+        },
+        {
+            key: "color",
+            get: /**
+   * 材质的主颜色
+   */ function get() {
+                return this.getColor("_Color");
+            },
+            set: function set(value) {
+                this.setColor("_Color", value);
+            }
+        },
         {
             key: "blending",
             set: /******** effects-core 中会调用 引擎必须实现 ***********************/ /**
@@ -10049,7 +10101,7 @@ var integrate = "float calculateMovement(float t,vec2 p1,vec2 p2,vec2 p3,vec2 p4
 
 var itemVert = "precision highp float;attribute vec2 atlasOffset;attribute vec3 aPos;varying vec2 vTexCoord;varying vec3 vParams;varying vec4 vColor;uniform vec2 _Size;uniform vec4 _Color;uniform vec4 _TexParams;uniform vec4 _TexOffset;uniform mat4 effects_MatrixVP;uniform mat4 effects_MatrixInvV;uniform mat4 effects_ObjectToWorld;\n#ifdef ENV_EDITOR\nuniform vec4 uEditorTransform;\n#endif\nvoid main(){vec4 texParams=_TexParams;vTexCoord=vec2(atlasOffset.xy*_TexOffset.zw+_TexOffset.xy);vColor=_Color;vParams=vec3(0.0,texParams.y,texParams.x);vec4 pos=vec4(aPos.xy*_Size,aPos.z,1.0);gl_Position=effects_MatrixVP*effects_ObjectToWorld*pos;\n#ifdef ENV_EDITOR\ngl_Position=vec4(gl_Position.xy*uEditorTransform.xy+uEditorTransform.zw*gl_Position.w,gl_Position.zw);\n#endif\n}";
 
-var itemFrag = "precision highp float;varying vec4 vColor;varying vec2 vTexCoord;varying vec3 vParams;uniform sampler2D uSampler0;vec4 blendColor(vec4 color,vec4 vc,float mode){vec4 ret=color*vc;float alpha=ret.a;if(mode==1.){ret.rgb*=alpha;}else if(mode==2.){ret.rgb*=alpha;ret.a=dot(ret.rgb,vec3(0.33333333));}else if(mode==3.){alpha=color.r*alpha;ret=vec4(vc.rgb*alpha,alpha);}return ret;}void main(){vec4 color=vec4(0.);vec4 texColor=texture2D(uSampler0,vTexCoord.xy);color=blendColor(texColor,vColor,floor(0.5+vParams.y));if(vParams.z==0.&&color.a<0.04){discard;}color.a=clamp(color.a,0.0,1.0);gl_FragColor=color;}";
+var itemFrag = "precision highp float;varying vec4 vColor;varying vec2 vTexCoord;varying vec3 vParams;uniform sampler2D _MainTex;vec4 blendColor(vec4 color,vec4 vc,float mode){vec4 ret=color*vc;float alpha=ret.a;if(mode==1.){ret.rgb*=alpha;}else if(mode==2.){ret.rgb*=alpha;ret.a=dot(ret.rgb,vec3(0.33333333));}else if(mode==3.){alpha=color.r*alpha;ret=vec4(vc.rgb*alpha,alpha);}return ret;}void main(){vec4 color=vec4(0.);vec4 texColor=texture2D(_MainTex,vTexCoord.xy);color=blendColor(texColor,vColor,floor(0.5+vParams.y));if(vParams.z==0.&&color.a<0.04){discard;}color.a=clamp(color.a,0.0,1.0);gl_FragColor=color;}";
 
 var particleFrag = "#version 100\nprecision mediump float;vec4 blendColor(vec4 color,vec4 vc,float mode){vec4 ret=color*vc;float alpha=ret.a;if(mode==1.){ret.rgb*=alpha;}else if(mode==2.){ret.rgb*=alpha;ret.a=dot(ret.rgb,vec3(0.33333333));}else if(mode==3.){alpha=color.r*alpha;ret=vec4(vc.rgb*alpha,alpha);}return ret;}\n#define PATICLE_SHADER 1\nvarying float vLife;varying vec2 vTexCoord;varying vec4 vColor;uniform vec3 emissionColor;uniform float emissionIntensity;uniform sampler2D uMaskTex;uniform vec4 uColorParams;uniform vec2 uTexOffset;\n#ifdef COLOR_OVER_LIFETIME\nuniform sampler2D uColorOverLifetime;\n#endif\n#ifdef USE_SPRITE\nvarying vec4 vTexCoordBlend;\n#endif\nvarying float vSeed;\n#ifdef PREVIEW_BORDER\nuniform vec4 uPreviewColor;\n#endif\n#ifdef USE_SPRITE\nvec4 getTextureColor(sampler2D tex,vec2 texCoord){if(vTexCoordBlend.w>0.){return mix(texture2D(tex,texCoord),texture2D(tex,vTexCoordBlend.xy+texCoord),vTexCoordBlend.z);}return texture2D(tex,texCoord);}\n#else\n#define getTextureColor texture2D\n#endif\n#ifndef WEBGL2\n#define round(a) floor(0.5+a)\n#endif\n#ifdef PREVIEW_BORDER\nvoid main(){gl_FragColor=uPreviewColor;}\n#else\nvoid main(){vec4 color=vec4(1.0);vec4 tempColor=vColor;vec2 texOffset=uTexOffset;if(vLife<0.){discard;}if(uColorParams.x>0.0){color=getTextureColor(uMaskTex,vTexCoord);}\n#ifdef COLOR_OVER_LIFETIME\n#ifndef ENABLE_VERTEX_TEXTURE\ntempColor*=texture2D(uColorOverLifetime,vec2(vLife,0.));\n#endif\n#endif\ncolor=blendColor(color,tempColor,round(uColorParams.y));if(color.a<=0.01&&uColorParams.w>0.){float _at=texture2D(uMaskTex,vTexCoord+texOffset).a+texture2D(uMaskTex,vTexCoord+texOffset*-1.).a;if(_at<=0.02){discard;}}vec3 emission=emissionColor*pow(2.0,emissionIntensity);color=vec4(pow(pow(color.rgb,vec3(2.2))+emission,vec3(1.0/2.2)),color.a);gl_FragColor=color;}\n#endif\n";
 
@@ -10280,15 +10332,15 @@ var BloomThresholdPass = /*#__PURE__*/ function(RenderPass) {
         renderer.setFramebuffer(this.framebuffer);
     };
     _proto.execute = function execute(renderer) {
-        var _renderer_renderingData_currentFrame_globalVolume;
+        var _renderer_renderingData_currentFrame_globalVolume_bloom, _renderer_renderingData_currentFrame_globalVolume;
         renderer.clear({
             colorAction: TextureStoreAction.clear,
             depthAction: TextureStoreAction.clear,
             stencilAction: TextureStoreAction.clear
         });
         this.screenMesh.material.setTexture("_MainTex", this.mainTexture);
-        var _renderer_renderingData_currentFrame_globalVolume_threshold;
-        var threshold = (_renderer_renderingData_currentFrame_globalVolume_threshold = (_renderer_renderingData_currentFrame_globalVolume = renderer.renderingData.currentFrame.globalVolume) == null ? void 0 : _renderer_renderingData_currentFrame_globalVolume.threshold) != null ? _renderer_renderingData_currentFrame_globalVolume_threshold : 1.0;
+        var _renderer_renderingData_currentFrame_globalVolume_bloom_threshold;
+        var threshold = (_renderer_renderingData_currentFrame_globalVolume_bloom_threshold = (_renderer_renderingData_currentFrame_globalVolume = renderer.renderingData.currentFrame.globalVolume) == null ? void 0 : (_renderer_renderingData_currentFrame_globalVolume_bloom = _renderer_renderingData_currentFrame_globalVolume.bloom) == null ? void 0 : _renderer_renderingData_currentFrame_globalVolume_bloom.threshold) != null ? _renderer_renderingData_currentFrame_globalVolume_bloom_threshold : 1.0;
         this.screenMesh.material.setFloat("_Threshold", threshold);
         renderer.renderMeshes([
             this.screenMesh
@@ -10501,25 +10553,44 @@ var ToneMappingPass = /*#__PURE__*/ function(RenderPass) {
             depthAction: TextureStoreAction.clear,
             stencilAction: TextureStoreAction.clear
         });
-        var _renderer_renderingData_currentFrame_globalVolume;
-        var _ref = (_renderer_renderingData_currentFrame_globalVolume = renderer.renderingData.currentFrame.globalVolume) != null ? _renderer_renderingData_currentFrame_globalVolume : {}, _ref_bloomEnabled = _ref.bloomEnabled, bloomEnabled = _ref_bloomEnabled === void 0 ? false : _ref_bloomEnabled, _ref_bloomIntensity = _ref.bloomIntensity, bloomIntensity = _ref_bloomIntensity === void 0 ? 1.0 : _ref_bloomIntensity, _ref_brightness = _ref.brightness, brightness = _ref_brightness === void 0 ? 1.0 : _ref_brightness, _ref_saturation = _ref.saturation, saturation = _ref_saturation === void 0 ? 1.0 : _ref_saturation, _ref_contrast = _ref.contrast, contrast = _ref_contrast === void 0 ? 1.0 : _ref_contrast, _ref_toneMappingEnabled = _ref.toneMappingEnabled, toneMappingEnabled = _ref_toneMappingEnabled === void 0 ? true : _ref_toneMappingEnabled, _ref_vignetteIntensity = _ref.vignetteIntensity, vignetteIntensity = _ref_vignetteIntensity === void 0 ? 0.2 : _ref_vignetteIntensity, _ref_vignetteSmoothness = _ref.vignetteSmoothness, vignetteSmoothness = _ref_vignetteSmoothness === void 0 ? 0.4 : _ref_vignetteSmoothness, _ref_vignetteRoundness = _ref.vignetteRoundness, vignetteRoundness = _ref_vignetteRoundness === void 0 ? 1.0 : _ref_vignetteRoundness;
+        var globalVolume = renderer.renderingData.currentFrame.globalVolume;
+        var bloom = _extends({
+            threshold: 0,
+            intensity: 0,
+            active: false
+        }, globalVolume == null ? void 0 : globalVolume.bloom);
+        var vignette = _extends({
+            intensity: 0,
+            smoothness: 0,
+            roundness: 0,
+            active: false
+        }, globalVolume == null ? void 0 : globalVolume.vignette);
+        var colorAdjustments = _extends({
+            brightness: 0,
+            saturation: 0,
+            contrast: 0,
+            active: false
+        }, globalVolume == null ? void 0 : globalVolume.colorAdjustments);
+        var tonemapping = _extends({
+            active: false
+        }, globalVolume == null ? void 0 : globalVolume.tonemapping);
         this.screenMesh.material.setTexture("_SceneTex", this.sceneTextureHandle.texture);
-        this.screenMesh.material.setFloat("_Brightness", brightness);
-        this.screenMesh.material.setFloat("_Saturation", saturation);
-        this.screenMesh.material.setFloat("_Contrast", contrast);
-        this.screenMesh.material.setInt("_UseBloom", Number(bloomEnabled));
-        if (bloomEnabled) {
+        this.screenMesh.material.setFloat("_Brightness", Math.pow(2, colorAdjustments.brightness));
+        this.screenMesh.material.setFloat("_Saturation", colorAdjustments.saturation * 0.01 + 1);
+        this.screenMesh.material.setFloat("_Contrast", colorAdjustments.contrast * 0.01 + 1);
+        this.screenMesh.material.setInt("_UseBloom", Number(bloom.active));
+        if (bloom.active) {
             this.screenMesh.material.setTexture("_GaussianTex", this.mainTexture);
-            this.screenMesh.material.setFloat("_BloomIntensity", bloomIntensity);
+            this.screenMesh.material.setFloat("_BloomIntensity", bloom.intensity);
         }
-        if (vignetteIntensity > 0) {
-            this.screenMesh.material.setFloat("_VignetteIntensity", vignetteIntensity);
-            this.screenMesh.material.setFloat("_VignetteSmoothness", vignetteSmoothness);
-            this.screenMesh.material.setFloat("_VignetteRoundness", vignetteRoundness);
+        if (vignette.intensity > 0) {
+            this.screenMesh.material.setFloat("_VignetteIntensity", vignette.intensity);
+            this.screenMesh.material.setFloat("_VignetteSmoothness", vignette.smoothness);
+            this.screenMesh.material.setFloat("_VignetteRoundness", vignette.roundness);
             this.screenMesh.material.setVector2("_VignetteCenter", new Vector2(0.5, 0.5));
             this.screenMesh.material.setVector3("_VignetteColor", new Vector3(0.0, 0.0, 0.0));
         }
-        this.screenMesh.material.setInt("_UseToneMapping", Number(toneMappingEnabled));
+        this.screenMesh.material.setInt("_UseToneMapping", Number(tonemapping.active));
         renderer.renderMeshes([
             this.screenMesh
         ]);
@@ -10559,6 +10630,9 @@ var seed$6 = 1;
         this.renderer = renderer;
         if (postProcessingEnabled) {
             var enableHDR = true;
+            if (!this.renderer.engine.gpuCapability.detail.halfFloatTexture) {
+                throw new Error("Half float texture is not supported.");
+            }
             // 使用HDR浮点纹理，FLOAT在IOS上报错，使用HALF_FLOAT
             var textureType = enableHDR ? glContext.HALF_FLOAT : glContext.UNSIGNED_BYTE;
             attachments = [
@@ -13304,7 +13378,9 @@ var ColorCurve = /*#__PURE__*/ function(ValueGetter) {
     return ColorCurve;
 }(ValueGetter);
 
-var BaseRenderComponent = /*#__PURE__*/ function(RendererComponent) {
+/**
+ * @since 2.1.0
+ */ var BaseRenderComponent = /*#__PURE__*/ function(RendererComponent) {
     _inherits(BaseRenderComponent, RendererComponent);
     function BaseRenderComponent(engine) {
         var _this;
@@ -13391,7 +13467,7 @@ var BaseRenderComponent = /*#__PURE__*/ function(RendererComponent) {
    * @param texture - 纹理对象
    */ _proto.setTexture = function setTexture(texture) {
         this.renderer.texture = texture;
-        this.material.setTexture("uSampler0", texture);
+        this.material.setTexture("_MainTex", texture);
     };
     /**
    * @internal
@@ -13470,51 +13546,60 @@ var BaseRenderComponent = /*#__PURE__*/ function(RendererComponent) {
         geometry.setIndexData(indexData);
         geometry.setAttributeData("atlasOffset", attributes.atlasOffset);
         geometry.setDrawCount(data.index.length);
-        for(var i = 0; i < textures.length; i++){
-            var texture1 = textures[i];
-            material.setTexture("uSampler" + i, texture1);
-        }
-        // FIXME: 内存泄漏的临时方案，后面再调整
-        var emptyTexture = this.emptyTexture;
-        for(var k = textures.length; k < maxSpriteMeshItemCount; k++){
-            material.setTexture("uSampler" + k, emptyTexture);
-        }
+        material.setTexture("_MainTex", texture);
     };
     _proto.getItemGeometryData = function getItemGeometryData() {
-        this.geometry.setAttributeData("aPos", new Float32Array([
-            -0.5,
-            0.5,
-            0,
-            -0.5,
-            -0.5,
-            0,
-            0.5,
-            0.5,
-            0,
-            0.5,
-            -0.5,
-            0
-        ]));
-        return {
-            index: [
-                0,
-                1,
-                2,
-                2,
-                1,
-                3
-            ],
-            atlasOffset: [
+        var renderer = this.renderer;
+        if (renderer.shape) {
+            var _renderer_shape = renderer.shape, _renderer_shape_index = _renderer_shape.index, index = _renderer_shape_index === void 0 ? [] : _renderer_shape_index, _renderer_shape_aPoint = _renderer_shape.aPoint, aPoint = _renderer_shape_aPoint === void 0 ? [] : _renderer_shape_aPoint;
+            var point = new Float32Array(aPoint);
+            var position = [];
+            var atlasOffset = [];
+            for(var i = 0; i < point.length; i += 6){
+                atlasOffset.push(aPoint[i + 2], aPoint[i + 3]);
+                position.push(point[i], point[i + 1], 0.0);
+            }
+            this.geometry.setAttributeData("aPos", new Float32Array(position));
+            return {
+                index: index,
+                atlasOffset: atlasOffset
+            };
+        } else {
+            this.geometry.setAttributeData("aPos", new Float32Array([
+                -0.5,
+                0.5,
                 0,
-                1,
+                -0.5,
+                -0.5,
                 0,
+                0.5,
+                0.5,
                 0,
-                1,
-                1,
-                1,
+                0.5,
+                -0.5,
                 0
-            ]
-        };
+            ]));
+            return {
+                index: [
+                    0,
+                    1,
+                    2,
+                    2,
+                    1,
+                    3
+                ],
+                atlasOffset: [
+                    0,
+                    1,
+                    0,
+                    0,
+                    1,
+                    1,
+                    1,
+                    0
+                ]
+            };
+        }
     };
     _proto.createGeometry = function createGeometry(mode) {
         return Geometry.create(this.engine, {
@@ -13579,7 +13664,7 @@ var BaseRenderComponent = /*#__PURE__*/ function(RendererComponent) {
         setBlendMode(material, states.blendMode);
         setMaskMode(material, states.maskMode);
         setSideMode(material, states.side);
-        material.shader.shaderData.properties = 'uSampler0("uSampler0",2D) = "white" {}';
+        material.shader.shaderData.properties = '_MainTex("_MainTex",2D) = "white" {}';
         if (!material.hasUniform("_Color")) {
             material.setVector4("_Color", new Vector4(0, 0, 0, 1));
         }
@@ -15147,30 +15232,497 @@ function recursive(x1, y1, x2, y2, x3, y3, x4, y4, points, distanceTolerance, le
             centerX += points[i];
             centerY += points[i + 1];
         }
-        centerX /= points.length / 2;
-        centerY /= points.length / 2;
-        // Set center vertex
-        var count = verticesOffset;
-        vertices[count * 2] = centerX;
-        vertices[count * 2 + 1] = centerY;
-        var centerIndex = count++;
-        // Set edge vertices and indices
-        for(var i1 = 0; i1 < points.length; i1 += 2){
-            vertices[count * 2] = points[i1];
-            vertices[count * 2 + 1] = points[i1 + 1];
-            if (i1 > 0) {
-                indices[indicesOffset++] = count;
-                indices[indicesOffset++] = centerIndex;
-                indices[indicesOffset++] = count - 1;
+        centerX /= points.length / 2;
+        centerY /= points.length / 2;
+        // Set center vertex
+        var count = verticesOffset;
+        vertices[count * 2] = centerX;
+        vertices[count * 2 + 1] = centerY;
+        var centerIndex = count++;
+        // Set edge vertices and indices
+        for(var i1 = 0; i1 < points.length; i1 += 2){
+            vertices[count * 2] = points[i1];
+            vertices[count * 2 + 1] = points[i1 + 1];
+            if (i1 > 0) {
+                indices[indicesOffset++] = count;
+                indices[indicesOffset++] = centerIndex;
+                indices[indicesOffset++] = count - 1;
+            }
+            count++;
+        }
+        // Connect last point to the first edge point
+        indices[indicesOffset++] = centerIndex + 1;
+        indices[indicesOffset++] = centerIndex;
+        indices[indicesOffset++] = count - 1;
+    };
+    return Ellipse;
+}(ShapePrimitive);
+
+var StarType;
+(function(StarType) {
+    StarType[StarType["Star"] = 0] = "Star";
+    StarType[StarType["Polygon"] = 1] = "Polygon";
+})(StarType || (StarType = {}));
+var PolyStar = /*#__PURE__*/ function(ShapePrimitive) {
+    _inherits(PolyStar, ShapePrimitive);
+    function PolyStar(pointCount, outerRadius, innerRadius, outerRoundness, innerRoundness, starType) {
+        if (pointCount === void 0) pointCount = 0;
+        if (outerRadius === void 0) outerRadius = 0;
+        if (innerRadius === void 0) innerRadius = 0;
+        if (outerRoundness === void 0) outerRoundness = 0;
+        if (innerRoundness === void 0) innerRoundness = 0;
+        if (starType === void 0) starType = 0;
+        var _this;
+        _this = ShapePrimitive.call(this) || this;
+        _this.pointCount = pointCount;
+        _this.outerRadius = outerRadius;
+        _this.innerRadius = innerRadius;
+        _this.outerRoundness = outerRoundness;
+        _this.innerRoundness = innerRoundness;
+        _this.starType = starType;
+        _this.v = [];
+        _this.in = [];
+        _this.out = [];
+        return _this;
+    }
+    var _proto = PolyStar.prototype;
+    _proto.clone = function clone() {
+        var polyStar = new PolyStar(this.pointCount, this.outerRadius, this.innerRadius, this.outerRoundness, this.innerRoundness, this.starType);
+        return polyStar;
+    };
+    _proto.copyFrom = function copyFrom(source) {
+        this.pointCount = source.pointCount;
+        this.outerRadius = source.outerRadius;
+        this.innerRadius = source.innerRadius;
+        this.outerRoundness = source.outerRoundness;
+        this.innerRoundness = source.innerRoundness;
+        this.starType = source.starType;
+    };
+    _proto.copyTo = function copyTo(destination) {
+        destination.copyFrom(this);
+    };
+    _proto.build = function build(points) {
+        switch(this.starType){
+            case 0:
+                {
+                    this.buildStarPath();
+                    break;
+                }
+            case 1:
+                {
+                    this.buildPolygonPath();
+                    break;
+                }
+        }
+        var smoothness = 1;
+        for(var i = 0; i < this.v.length - 2; i += 2){
+            buildAdaptiveBezier(points, this.v[i], this.v[i + 1], this.out[i], this.out[i + 1], this.in[i + 2], this.in[i + 3], this.v[i + 2], this.v[i + 3], smoothness);
+        }
+        // draw last curve
+        var lastIndex = this.v.length - 1;
+        buildAdaptiveBezier(points, this.v[lastIndex - 1], this.v[lastIndex], this.out[lastIndex - 1], this.out[lastIndex], this.in[0], this.in[1], this.v[0], this.v[1], smoothness);
+    };
+    _proto.triangulate = function triangulate1(points, vertices, verticesOffset, indices, indicesOffset) {
+        var triangles = triangulate([
+            points
+        ]);
+        for(var i = 0; i < triangles.length; i++){
+            vertices[verticesOffset + i] = triangles[i];
+        }
+        var vertexCount = triangles.length / 2;
+        for(var i1 = 0; i1 < vertexCount; i1++){
+            indices[indicesOffset + i1] = i1;
+        }
+    };
+    _proto.buildStarPath = function buildStarPath() {
+        this.v = [];
+        this.in = [];
+        this.out = [];
+        var numPts = Math.floor(this.pointCount) * 2;
+        var angle = Math.PI * 2 / numPts;
+        var longFlag = true;
+        var longRad = this.outerRadius;
+        var shortRad = this.innerRadius;
+        var longRound = this.outerRoundness / 100;
+        var shortRound = this.innerRoundness / 100;
+        var longPerimSegment = 2 * Math.PI * longRad / (numPts * 2);
+        var shortPerimSegment = 2 * Math.PI * shortRad / (numPts * 2);
+        var i;
+        var rad;
+        var roundness;
+        var perimSegment;
+        var currentAng = -Math.PI / 2;
+        var dir = 1;
+        for(i = 0; i < numPts; i++){
+            rad = longFlag ? longRad : shortRad;
+            roundness = longFlag ? longRound : shortRound;
+            perimSegment = longFlag ? longPerimSegment : shortPerimSegment;
+            var x = rad * Math.cos(currentAng);
+            var y = rad * Math.sin(currentAng);
+            var ox = x === 0 && y === 0 ? 0 : y / Math.sqrt(x * x + y * y);
+            var oy = x === 0 && y === 0 ? 0 : -x / Math.sqrt(x * x + y * y);
+            var offset = i * 2;
+            this.v[offset] = x;
+            this.v[offset + 1] = y;
+            this.in[offset] = x + ox * perimSegment * roundness * dir;
+            this.in[offset + 1] = y + oy * perimSegment * roundness * dir;
+            this.out[offset] = x - ox * perimSegment * roundness * dir;
+            this.out[offset + 1] = y - oy * perimSegment * roundness * dir;
+            longFlag = !longFlag;
+            currentAng += angle * dir;
+        }
+    };
+    _proto.buildPolygonPath = function buildPolygonPath() {
+        this.v = [];
+        this.in = [];
+        this.out = [];
+        var numPts = Math.floor(this.pointCount);
+        var angle = Math.PI * 2 / numPts;
+        var rad = this.outerRadius;
+        var roundness = this.outerRoundness / 100;
+        var perimSegment = 2 * Math.PI * rad / (numPts * 4);
+        var i;
+        var currentAng = -Math.PI * 0.5;
+        var dir = 1;
+        for(i = 0; i < numPts; i++){
+            var x = rad * Math.cos(currentAng);
+            var y = rad * Math.sin(currentAng);
+            var ox = x === 0 && y === 0 ? 0 : y / Math.sqrt(x * x + y * y);
+            var oy = x === 0 && y === 0 ? 0 : -x / Math.sqrt(x * x + y * y);
+            var offset = i * 2;
+            this.v[offset] = x;
+            this.v[offset + 1] = y;
+            this.in[offset] = x + ox * perimSegment * roundness * dir;
+            this.in[offset + 1] = y + oy * perimSegment * roundness * dir;
+            this.out[offset] = x - ox * perimSegment * roundness * dir;
+            this.out[offset + 1] = y - oy * perimSegment * roundness * dir;
+            currentAng += angle * dir;
+        }
+    };
+    return PolyStar;
+}(ShapePrimitive);
+
+// const tempPoints = [new Point(), new Point(), new Point(), new Point()];
+/**
+ * The `Rectangle` object is an area defined by its position, as indicated by its top-left corner
+ * point (`x`, `y`) and by its `width` and its `height`.
+ */ var Rectangle$1 = /*#__PURE__*/ function(ShapePrimitive) {
+    _inherits(Rectangle, ShapePrimitive);
+    function Rectangle(x, y, width, height) {
+        if (x === void 0) x = 0;
+        if (y === void 0) y = 0;
+        if (width === void 0) width = 0;
+        if (height === void 0) height = 0;
+        var _this;
+        _this = ShapePrimitive.call(this) || this;
+        _this.x = Number(x);
+        _this.y = Number(y);
+        _this.width = Number(width);
+        _this.height = Number(height);
+        return _this;
+    }
+    var _proto = Rectangle.prototype;
+    /** Determines whether the Rectangle is empty. */ _proto.isEmpty = function isEmpty() {
+        return this.left === this.right || this.top === this.bottom;
+    };
+    /**
+   * Creates a clone of this Rectangle
+   * @returns a copy of the rectangle
+   */ _proto.clone = function clone() {
+        return new Rectangle(this.x, this.y, this.width, this.height);
+    };
+    /**
+   * Converts a Bounds object to a Rectangle object.
+   * @param bounds - The bounds to copy and convert to a rectangle.
+   * @returns Returns itself.
+   */ //   copyFromBounds (bounds: Bounds): this {
+    //     this.x = bounds.minX;
+    //     this.y = bounds.minY;
+    //     this.width = bounds.maxX - bounds.minX;
+    //     this.height = bounds.maxY - bounds.minY;
+    //     return this;
+    //   }
+    /**
+   * Copies another rectangle to this one.
+   * @param rectangle - The rectangle to copy from.
+   * @returns Returns itself.
+   */ _proto.copyFrom = function copyFrom(rectangle) {
+        this.x = rectangle.x;
+        this.y = rectangle.y;
+        this.width = rectangle.width;
+        this.height = rectangle.height;
+        return this;
+    };
+    /**
+   * Copies this rectangle to another one.
+   * @param rectangle - The rectangle to copy to.
+   * @returns Returns given parameter.
+   */ _proto.copyTo = function copyTo(rectangle) {
+        rectangle.copyFrom(this);
+        return rectangle;
+    };
+    /**
+   * Checks whether the x and y coordinates given are contained within this Rectangle
+   * @param x - The X coordinate of the point to test
+   * @param y - The Y coordinate of the point to test
+   * @returns Whether the x/y coordinates are within this Rectangle
+   */ _proto.contains = function contains(x, y) {
+        if (this.width <= 0 || this.height <= 0) {
+            return false;
+        }
+        if (x >= this.x && x < this.x + this.width) {
+            if (y >= this.y && y < this.y + this.height) {
+                return true;
+            }
+        }
+        return false;
+    };
+    /**
+   * Checks whether the x and y coordinates given are contained within this rectangle including the stroke.
+   * @param x - The X coordinate of the point to test
+   * @param y - The Y coordinate of the point to test
+   * @param strokeWidth - The width of the line to check
+   * @returns Whether the x/y coordinates are within this rectangle
+   */ _proto.strokeContains = function strokeContains(x, y, strokeWidth) {
+        var _this = this, width = _this.width, height = _this.height;
+        if (width <= 0 || height <= 0) {
+            return false;
+        }
+        var _x = this.x;
+        var _y = this.y;
+        var outerLeft = _x - strokeWidth / 2;
+        var outerRight = _x + width + strokeWidth / 2;
+        var outerTop = _y - strokeWidth / 2;
+        var outerBottom = _y + height + strokeWidth / 2;
+        var innerLeft = _x + strokeWidth / 2;
+        var innerRight = _x + width - strokeWidth / 2;
+        var innerTop = _y + strokeWidth / 2;
+        var innerBottom = _y + height - strokeWidth / 2;
+        return x >= outerLeft && x <= outerRight && y >= outerTop && y <= outerBottom && !(x > innerLeft && x < innerRight && y > innerTop && y < innerBottom);
+    };
+    /**
+   * Determines whether the `other` Rectangle transformed by `transform` intersects with `this` Rectangle object.
+   * Returns true only if the area of the intersection is >0, this means that Rectangles
+   * sharing a side are not overlapping. Another side effect is that an arealess rectangle
+   * (width or height equal to zero) can't intersect any other rectangle.
+   * @param {Rectangle} other - The Rectangle to intersect with `this`.
+   * @param {Matrix} transform - The transformation matrix of `other`.
+   * @returns {boolean} A value of `true` if the transformed `other` Rectangle intersects with `this`; otherwise `false`.
+   */ //   intersects (other: Rectangle, transform?: Matrix4): boolean {
+    //     if (!transform) {
+    //       const x0 = this.x < other.x ? other.x : this.x;
+    //       const x1 = this.right > other.right ? other.right : this.right;
+    //       if (x1 <= x0) {
+    //         return false;
+    //       }
+    //       const y0 = this.y < other.y ? other.y : this.y;
+    //       const y1 = this.bottom > other.bottom ? other.bottom : this.bottom;
+    //       return y1 > y0;
+    //     }
+    //     const x0 = this.left;
+    //     const x1 = this.right;
+    //     const y0 = this.top;
+    //     const y1 = this.bottom;
+    //     if (x1 <= x0 || y1 <= y0) {
+    //       return false;
+    //     }
+    //     const lt = tempPoints[0].set(other.left, other.top);
+    //     const lb = tempPoints[1].set(other.left, other.bottom);
+    //     const rt = tempPoints[2].set(other.right, other.top);
+    //     const rb = tempPoints[3].set(other.right, other.bottom);
+    //     if (rt.x <= lt.x || lb.y <= lt.y) {
+    //       return false;
+    //     }
+    //     const s = Math.sign((transform.a * transform.d) - (transform.b * transform.c));
+    //     if (s === 0) {
+    //       return false;
+    //     }
+    //     transform.apply(lt, lt);
+    //     transform.apply(lb, lb);
+    //     transform.apply(rt, rt);
+    //     transform.apply(rb, rb);
+    //     if (Math.max(lt.x, lb.x, rt.x, rb.x) <= x0
+    //             || Math.min(lt.x, lb.x, rt.x, rb.x) >= x1
+    //             || Math.max(lt.y, lb.y, rt.y, rb.y) <= y0
+    //             || Math.min(lt.y, lb.y, rt.y, rb.y) >= y1) {
+    //       return false;
+    //     }
+    //     const nx = s * (lb.y - lt.y);
+    //     const ny = s * (lt.x - lb.x);
+    //     const n00 = (nx * x0) + (ny * y0);
+    //     const n10 = (nx * x1) + (ny * y0);
+    //     const n01 = (nx * x0) + (ny * y1);
+    //     const n11 = (nx * x1) + (ny * y1);
+    //     if (Math.max(n00, n10, n01, n11) <= (nx * lt.x) + (ny * lt.y)
+    //             || Math.min(n00, n10, n01, n11) >= (nx * rb.x) + (ny * rb.y)) {
+    //       return false;
+    //     }
+    //     const mx = s * (lt.y - rt.y);
+    //     const my = s * (rt.x - lt.x);
+    //     const m00 = (mx * x0) + (my * y0);
+    //     const m10 = (mx * x1) + (my * y0);
+    //     const m01 = (mx * x0) + (my * y1);
+    //     const m11 = (mx * x1) + (my * y1);
+    //     if (Math.max(m00, m10, m01, m11) <= (mx * lt.x) + (my * lt.y)
+    //             || Math.min(m00, m10, m01, m11) >= (mx * rb.x) + (my * rb.y)) {
+    //       return false;
+    //     }
+    //     return true;
+    //   }
+    /**
+   * Pads the rectangle making it grow in all directions.
+   * If paddingY is omitted, both paddingX and paddingY will be set to paddingX.
+   * @param paddingX - The horizontal padding amount.
+   * @param paddingY - The vertical padding amount.
+   * @returns Returns itself.
+   */ _proto.pad = function pad(paddingX, paddingY) {
+        if (paddingX === void 0) paddingX = 0;
+        if (paddingY === void 0) paddingY = paddingX;
+        this.x -= paddingX;
+        this.y -= paddingY;
+        this.width += paddingX * 2;
+        this.height += paddingY * 2;
+        return this;
+    };
+    /**
+   * Fits this rectangle around the passed one.
+   * @param rectangle - The rectangle to fit.
+   * @returns Returns itself.
+   */ _proto.fit = function fit(rectangle) {
+        var x1 = Math.max(this.x, rectangle.x);
+        var x2 = Math.min(this.x + this.width, rectangle.x + rectangle.width);
+        var y1 = Math.max(this.y, rectangle.y);
+        var y2 = Math.min(this.y + this.height, rectangle.y + rectangle.height);
+        this.x = x1;
+        this.width = Math.max(x2 - x1, 0);
+        this.y = y1;
+        this.height = Math.max(y2 - y1, 0);
+        return this;
+    };
+    /**
+   * Enlarges rectangle that way its corners lie on grid
+   * @param resolution - resolution
+   * @param eps - precision
+   * @returns Returns itself.
+   */ _proto.ceil = function ceil(resolution, eps) {
+        if (resolution === void 0) resolution = 1;
+        if (eps === void 0) eps = 0.001;
+        var x2 = Math.ceil((this.x + this.width - eps) * resolution) / resolution;
+        var y2 = Math.ceil((this.y + this.height - eps) * resolution) / resolution;
+        this.x = Math.floor((this.x + eps) * resolution) / resolution;
+        this.y = Math.floor((this.y + eps) * resolution) / resolution;
+        this.width = x2 - this.x;
+        this.height = y2 - this.y;
+        return this;
+    };
+    /**
+   * Enlarges this rectangle to include the passed rectangle.
+   * @param rectangle - The rectangle to include.
+   * @returns Returns itself.
+   */ _proto.enlarge = function enlarge(rectangle) {
+        var x1 = Math.min(this.x, rectangle.x);
+        var x2 = Math.max(this.x + this.width, rectangle.x + rectangle.width);
+        var y1 = Math.min(this.y, rectangle.y);
+        var y2 = Math.max(this.y + this.height, rectangle.y + rectangle.height);
+        this.x = x1;
+        this.width = x2 - x1;
+        this.y = y1;
+        this.height = y2 - y1;
+        return this;
+    };
+    /**
+   * Returns the framing rectangle of the rectangle as a Rectangle object
+   * @param out - optional rectangle to store the result
+   * @returns The framing rectangle
+   */ _proto.getBounds = function getBounds(out) {
+        out = out || new Rectangle();
+        out.copyFrom(this);
+        return out;
+    };
+    _proto.getX = function getX() {
+        return this.x;
+    };
+    _proto.getY = function getY() {
+        return this.y;
+    };
+    _proto.build = function build(points) {
+        var x = this.x;
+        var y = this.y;
+        var width = this.width;
+        var height = this.height;
+        if (!(width >= 0 && height >= 0)) {
+            return points;
+        }
+        points[0] = x;
+        points[1] = y;
+        points[2] = x + width;
+        points[3] = y;
+        points[4] = x + width;
+        points[5] = y + height;
+        points[6] = x;
+        points[7] = y + height;
+        return points;
+    };
+    _proto.triangulate = function triangulate(points, vertices, verticesOffset, indices, indicesOffset) {
+        var count = 0;
+        var verticesStride = 2;
+        verticesOffset *= verticesStride;
+        vertices[verticesOffset + count] = points[0];
+        vertices[verticesOffset + count + 1] = points[1];
+        count += verticesStride;
+        vertices[verticesOffset + count] = points[2];
+        vertices[verticesOffset + count + 1] = points[3];
+        count += verticesStride;
+        vertices[verticesOffset + count] = points[6];
+        vertices[verticesOffset + count + 1] = points[7];
+        count += verticesStride;
+        vertices[verticesOffset + count] = points[4];
+        vertices[verticesOffset + count + 1] = points[5];
+        count += verticesStride;
+        var verticesIndex = verticesOffset / verticesStride;
+        // triangle 1
+        indices[indicesOffset++] = verticesIndex;
+        indices[indicesOffset++] = verticesIndex + 1;
+        indices[indicesOffset++] = verticesIndex + 2;
+        // triangle 2
+        indices[indicesOffset++] = verticesIndex + 1;
+        indices[indicesOffset++] = verticesIndex + 3;
+        indices[indicesOffset++] = verticesIndex + 2;
+    };
+    _create_class(Rectangle, [
+        {
+            key: "left",
+            get: /** Returns the left edge of the rectangle. */ function get() {
+                return this.x;
+            }
+        },
+        {
+            key: "right",
+            get: /** Returns the right edge of the rectangle. */ function get() {
+                return this.x + this.width;
+            }
+        },
+        {
+            key: "top",
+            get: /** Returns the top edge of the rectangle. */ function get() {
+                return this.y;
+            }
+        },
+        {
+            key: "bottom",
+            get: /** Returns the bottom edge of the rectangle. */ function get() {
+                return this.y + this.height;
+            }
+        }
+    ], [
+        {
+            key: "EMPTY",
+            get: /** A constant empty rectangle. This is a new object every time the property is accessed */ function get() {
+                return new Rectangle(0, 0, 0, 0);
             }
-            count++;
         }
-        // Connect last point to the first edge point
-        indices[indicesOffset++] = centerIndex + 1;
-        indices[indicesOffset++] = centerIndex;
-        indices[indicesOffset++] = count - 1;
-    };
-    return Ellipse;
+    ]);
+    return Rectangle;
 }(ShapePrimitive);
 
 var ShapePath = /*#__PURE__*/ function() {
@@ -15204,6 +15756,16 @@ var ShapePath = /*#__PURE__*/ function() {
                         this.ellipse(data[0], data[1], data[2], data[3], data[4]);
                         break;
                     }
+                case "polyStar":
+                    {
+                        this.polyStar(data[0], data[1], data[2], data[3], data[4], data[5], data[6]);
+                        break;
+                    }
+                case "rect":
+                    {
+                        this.rect(data[0], data[1], data[2], data[3], data[4]);
+                        break;
+                    }
             }
         }
         this.endPoly();
@@ -15244,6 +15806,22 @@ var ShapePath = /*#__PURE__*/ function() {
         this.drawShape(new Ellipse(x, y, radiusX, radiusY), transform);
         return this;
     };
+    _proto.polyStar = function polyStar(pointCount, outerRadius, innerRadius, outerRoundness, innerRoundness, starType, transform) {
+        this.drawShape(new PolyStar(pointCount, outerRadius, innerRadius, outerRoundness, innerRoundness, starType), transform);
+        return this;
+    };
+    /**
+   * Draws a rectangle shape. This method adds a new rectangle path to the current drawing.
+   * @param x - The x-coordinate of the top-left corner of the rectangle.
+   * @param y - The y-coordinate of the top-left corner of the rectangle.
+   * @param w - The width of the rectangle.
+   * @param h - The height of the rectangle.
+   * @param transform - An optional `Matrix` object to apply a transformation to the rectangle.
+   * @returns The instance of the current object for chaining.
+   */ _proto.rect = function rect(x, y, w, h, transform) {
+        this.drawShape(new Rectangle$1(x, y, w, h), transform);
+        return this;
+    };
     /**
    * Draws a given shape on the canvas.
    * This is a generic method that can draw any type of shape specified by the `ShapePrimitive` parameter.
@@ -15400,6 +15978,22 @@ var GraphicsPath = /*#__PURE__*/ function() {
         this.dirty = true;
         return this;
     };
+    _proto.polyStar = function polyStar(pointCount, outerRadius, innerRadius, outerRoundness, innerRoundness, starType, transform) {
+        this.instructions.push({
+            action: "polyStar",
+            data: [
+                pointCount,
+                outerRadius,
+                innerRadius,
+                outerRoundness,
+                innerRoundness,
+                starType,
+                transform
+            ]
+        });
+        this.dirty = true;
+        return this;
+    };
     _proto.clear = function clear() {
         this.instructions.length = 0;
         this.dirty = true;
@@ -15477,7 +16071,7 @@ var ShapeComponent = /*#__PURE__*/ function(MeshComponent) {
             };
             _this.material = Material.create(engine, materialProps);
             _this.material.setColor("_Color", new Color(1, 1, 1, 1));
-            _this.material.depthMask = true;
+            _this.material.depthMask = false;
             _this.material.depthTest = true;
             _this.material.blending = true;
         }
@@ -15542,16 +16136,18 @@ var ShapeComponent = /*#__PURE__*/ function(MeshComponent) {
     };
     _proto.buildPath = function buildPath(data) {
         this.path.clear();
-        switch(data.type){
+        var shapeData = data;
+        switch(shapeData.type){
             case 0:
                 {
-                    var customData = data;
-                    var points = customData.param.points;
-                    var easingIns = customData.param.easingIn;
-                    var easingOuts = customData.param.easingOut;
+                    var customData = shapeData;
+                    var points = customData.points;
+                    var easingIns = customData.easingIns;
+                    var easingOuts = customData.easingOuts;
                     this.curveValues = [];
-                    for(var _iterator = _create_for_of_iterator_helper_loose(customData.param.shapes), _step; !(_step = _iterator()).done;){
+                    for(var _iterator = _create_for_of_iterator_helper_loose(customData.shapes), _step; !(_step = _iterator()).done;){
                         var shape = _step.value;
+                        this.setFillColor(shape.fill);
                         var indices = shape.indexes;
                         for(var i = 1; i < indices.length; i++){
                             var pointIndex = indices[i];
@@ -15581,45 +16177,206 @@ var ShapeComponent = /*#__PURE__*/ function(MeshComponent) {
                 }
             case 2:
                 {
-                    var ellipseData = data;
-                    var ellipseParam = ellipseData.param;
-                    this.path.ellipse(0, 0, ellipseParam.xRadius, ellipseParam.yRadius);
+                    var ellipseData = shapeData;
+                    this.path.ellipse(0, 0, ellipseData.xRadius, ellipseData.yRadius);
+                    this.setFillColor(ellipseData.fill);
+                    break;
+                }
+            case 1:
+                {
+                    var rectangleData = shapeData;
+                    this.path.rect(-rectangleData.width / 2, rectangleData.height / 2, rectangleData.width, rectangleData.height);
+                    this.setFillColor(rectangleData.fill);
+                    break;
+                }
+            case 4:
+                {
+                    var starData = shapeData;
+                    this.path.polyStar(starData.pointCount, starData.outerRadius, starData.innerRadius, starData.outerRoundness, starData.innerRoundness, StarType.Star);
+                    this.setFillColor(starData.fill);
+                    break;
+                }
+            case 3:
+                {
+                    var polygonData = shapeData;
+                    this.path.polyStar(polygonData.pointCount, polygonData.radius, polygonData.radius, polygonData.roundness, polygonData.roundness, StarType.Polygon);
+                    this.setFillColor(polygonData.fill);
                     break;
                 }
         }
     };
+    _proto.setFillColor = function setFillColor(fill) {
+        if (fill) {
+            var color = fill.color;
+            this.material.setColor("_Color", new Color(color.r, color.g, color.b, color.a));
+        }
+    };
     _proto.fromData = function fromData(data) {
         MeshComponent.prototype.fromData.call(this, data);
         this.data = data;
+        var material = this.material;
+        //@ts-expect-error // TODO 新版蒙版上线后重构
+        material.stencilRef = data.renderer.mask !== undefined ? [
+            data.renderer.mask,
+            data.renderer.mask
+        ] : undefined;
+        //@ts-expect-error // TODO 新版蒙版上线后重构
+        setMaskMode(material, data.renderer.maskMode);
     };
     return ShapeComponent;
 }(MeshComponent);
 ShapeComponent = __decorate([
     effectsClass("ShapeComponent")
 ], ShapeComponent);
-var ComponentShapeType;
-(function(ComponentShapeType) {
+var ShapePrimitiveType;
+(function(ShapePrimitiveType) {
     /**
    * 自定义图形
-   */ ComponentShapeType[ComponentShapeType["CUSTOM"] = 0] = "CUSTOM";
+   */ ShapePrimitiveType[ShapePrimitiveType["Custom"] = 0] = "Custom";
     /**
    * 矩形
-   */ ComponentShapeType[ComponentShapeType["RECTANGLE"] = 1] = "RECTANGLE";
+   */ ShapePrimitiveType[ShapePrimitiveType["Rectangle"] = 1] = "Rectangle";
     /**
    * 椭圆
-   */ ComponentShapeType[ComponentShapeType["ELLIPSE"] = 2] = "ELLIPSE";
+   */ ShapePrimitiveType[ShapePrimitiveType["Ellipse"] = 2] = "Ellipse";
     /**
    * 多边形
-   */ ComponentShapeType[ComponentShapeType["POLYGON"] = 3] = "POLYGON";
+   */ ShapePrimitiveType[ShapePrimitiveType["Polygon"] = 3] = "Polygon";
     /**
    * 星形
-   */ ComponentShapeType[ComponentShapeType["STAR"] = 4] = "STAR";
-})(ComponentShapeType || (ComponentShapeType = {}));
+   */ ShapePrimitiveType[ShapePrimitiveType["Star"] = 4] = "Star";
+})(ShapePrimitiveType || (ShapePrimitiveType = {}));
 var ShapeConnectType;
 (function(ShapeConnectType) {})(ShapeConnectType || (ShapeConnectType = {}));
 var ShapePointType;
 (function(ShapePointType) {})(ShapePointType || (ShapePointType = {}));
 
+var Fake3DComponent = /*#__PURE__*/ function(Component) {
+    _inherits(Fake3DComponent, Component);
+    function Fake3DComponent() {
+        var _this;
+        _this = Component.apply(this, arguments) || this;
+        _this.loop = false;
+        _this.amountOfMotion = 1.0;
+        _this.animationLength = 2.0;
+        _this.mode = 1;
+        _this.startPositionX = 0;
+        _this.startPositionY = 0;
+        _this.startPositionZ = 0;
+        _this.endPositionX = 0;
+        _this.endPositionY = 0;
+        _this.endPositionZ = 0;
+        _this.amplitudeX = 0;
+        _this.amplitudeY = 0;
+        _this.amplitudeZ = 0;
+        _this.phaseX = 0;
+        _this.phaseY = 0;
+        _this.phaseZ = 0;
+        return _this;
+    }
+    var _proto = Fake3DComponent.prototype;
+    _proto.onStart = function onStart() {
+        this.effectComponent = this.item.getComponent(EffectComponent);
+    };
+    _proto.onUpdate = function onUpdate(dt) {
+        this.updateFake3D();
+    };
+    _proto.updateFake3D = function updateFake3D() {
+        if (!this.effectComponent) {
+            return;
+        }
+        var time = this.item.time % this.animationLength / this.animationLength;
+        var _PosX = 0;
+        var _PosY = 0;
+        var _PosZ = 0;
+        switch(this.mode){
+            case 0:
+                {
+                    var PI = Math.PI;
+                    _PosX = Math.sin(2.0 * PI * (time + this.phaseX)) * this.amplitudeX;
+                    _PosY = Math.sin(2.0 * PI * (time + this.phaseY)) * this.amplitudeY;
+                    _PosZ = Math.sin(2.0 * PI * (time + this.phaseZ)) * this.amplitudeZ;
+                    break;
+                }
+            case 1:
+                {
+                    var localTime = time;
+                    if (this.loop) {
+                        if (localTime > 0.5) {
+                            localTime = 1 - localTime;
+                        }
+                        localTime *= 2;
+                    }
+                    _PosX = this.startPositionX * (1 - localTime) + localTime * this.endPositionX;
+                    _PosY = this.startPositionY * (1 - localTime) + localTime * this.endPositionY;
+                    _PosZ = this.startPositionZ * (1 - localTime) + localTime * this.endPositionZ;
+                    break;
+                }
+        }
+        var material = this.effectComponent.material;
+        material.setFloat("_PosX", _PosX * this.amountOfMotion);
+        material.setFloat("_PosY", _PosY * this.amountOfMotion);
+        material.setFloat("_PosZ", _PosZ * this.amountOfMotion);
+    };
+    return Fake3DComponent;
+}(Component);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "loop", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "amountOfMotion", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "animationLength", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "mode", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "startPositionX", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "startPositionY", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "startPositionZ", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "endPositionX", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "endPositionY", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "endPositionZ", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "amplitudeX", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "amplitudeY", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "amplitudeZ", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "phaseX", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "phaseY", void 0);
+__decorate([
+    serialize()
+], Fake3DComponent.prototype, "phaseZ", void 0);
+Fake3DComponent = __decorate([
+    effectsClass("Fake3DComponent")
+], Fake3DComponent);
+var Fake3DAnimationMode;
+(function(Fake3DAnimationMode) {
+    Fake3DAnimationMode[Fake3DAnimationMode["Circular"] = 0] = "Circular";
+    Fake3DAnimationMode[Fake3DAnimationMode["Linear"] = 1] = "Linear";
+})(Fake3DAnimationMode || (Fake3DAnimationMode = {}));
+
 var CameraController = /*#__PURE__*/ function(Behaviour) {
     _inherits(CameraController, Behaviour);
     function CameraController(engine, props) {
@@ -15990,8 +16747,8 @@ var InteractComponent = /*#__PURE__*/ function(RendererComponent) {
                 0
             ]
         };
+        _this.duringPlay = false;
         /** 是否响应点击和拖拽交互事件 */ _this._interactive = true;
-        _this.hasBeenAddedToComposition = false;
         _this.getHitTestParams = function(force) {
             if (!_this.clickable) {
                 return;
@@ -16028,7 +16785,6 @@ var InteractComponent = /*#__PURE__*/ function(RendererComponent) {
         ];
     };
     _proto.onStart = function onStart() {
-        var _this = this;
         var options = this.item.props.content.options;
         var env = this.item.engine.renderer.env;
         var composition = this.item.composition;
@@ -16052,32 +16808,35 @@ var InteractComponent = /*#__PURE__*/ function(RendererComponent) {
             this.materials = this.previewContent.mesh.materials;
         }
         this.item.getHitTestParams = this.getHitTestParams;
-        this.item.onEnd = function() {
-            if (_this.item && _this.item.composition) {
-                var _this_previewContent;
-                _this.item.composition.removeInteractiveItem(_this.item, _this.item.props.content.options.type);
-                _this.clickable = false;
-                _this.hasBeenAddedToComposition = false;
-                (_this_previewContent = _this.previewContent) == null ? void 0 : _this_previewContent.mesh.dispose();
-                _this.endDragTarget();
+    };
+    _proto.onDisable = function onDisable() {
+        if (this.item && this.item.composition) {
+            var _this_previewContent;
+            if (this.duringPlay && !this.item.transform.getValid()) {
+                this.item.composition.removeInteractiveItem(this.item, this.item.props.content.options.type);
+                this.duringPlay = false;
             }
-        };
+            this.clickable = false;
+            (_this_previewContent = this.previewContent) == null ? void 0 : _this_previewContent.mesh.dispose();
+            this.endDragTarget();
+        }
+    };
+    _proto.onEnable = function onEnable() {
+        var type = this.interactData.options.type;
+        if (type === InteractType.CLICK) {
+            this.clickable = true;
+        }
     };
     _proto.onUpdate = function onUpdate(dt) {
         var _this_previewContent;
-        if (!this.isActiveAndEnabled) {
-            return;
-        }
-        (_this_previewContent = this.previewContent) == null ? void 0 : _this_previewContent.updateMesh();
-        if (!this.hasBeenAddedToComposition && this.item.composition) {
-            var type = this.interactData.options.type;
-            if (type === InteractType.CLICK) {
-                this.clickable = true;
-            }
+        this.duringPlay = true;
+        // trigger messageBegin when item enter
+        if (this.item.time > 0 && this.item.time - dt / 1000 <= 0) {
+            var _this_item_composition;
             var options = this.item.props.content.options;
-            this.item.composition.addInteractiveItem(this.item, options.type);
-            this.hasBeenAddedToComposition = true;
+            (_this_item_composition = this.item.composition) == null ? void 0 : _this_item_composition.addInteractiveItem(this.item, options.type);
         }
+        (_this_previewContent = this.previewContent) == null ? void 0 : _this_previewContent.updateMesh();
         if (!this.dragEvent || !this.bouncingArg) {
             return;
         }
@@ -16245,7 +17004,9 @@ function shouldIgnoreBouncing(arg, mul) {
     return arg && Math.abs(arg.vx || 0) < threshold && Math.abs(arg.vy || 0) < threshold;
 }
 
-var MeshCollider = /*#__PURE__*/ function() {
+/**
+ *
+ */ var MeshCollider = /*#__PURE__*/ function() {
     function MeshCollider() {
         this.triangles = [];
     }
@@ -16253,6 +17014,38 @@ var MeshCollider = /*#__PURE__*/ function() {
     _proto.getBoundingBoxData = function getBoundingBoxData() {
         return this.boundingBoxData;
     };
+    _proto.getBoundingBox = function getBoundingBox() {
+        var maxX = -Number.MAX_VALUE;
+        var maxY = -Number.MAX_VALUE;
+        var minX = Number.MAX_VALUE;
+        var minY = Number.MAX_VALUE;
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.boundingBoxData.area), _step; !(_step = _iterator()).done;){
+            var triangle = _step.value;
+            maxX = Math.max(triangle.p0.x, triangle.p1.x, triangle.p2.x, maxX);
+            maxY = Math.max(triangle.p0.y, triangle.p1.y, triangle.p2.y, maxY);
+            minX = Math.min(triangle.p0.x, triangle.p1.x, triangle.p2.x, minX);
+            minY = Math.min(triangle.p0.y, triangle.p1.y, triangle.p2.y, minY);
+        }
+        var area = [];
+        var point0 = new Vector3(minX, maxY, 0);
+        var point1 = new Vector3(maxX, maxY, 0);
+        var point2 = new Vector3(maxX, minY, 0);
+        var point3 = new Vector3(minX, minY, 0);
+        area.push({
+            p0: point0,
+            p1: point1,
+            p2: point2
+        });
+        area.push({
+            p0: point0,
+            p1: point2,
+            p2: point3
+        });
+        return {
+            type: HitTestType.triangle,
+            area: area
+        };
+    };
     _proto.setGeometry = function setGeometry(geometry, worldMatrix) {
         if (this.geometry !== geometry) {
             this.triangles = this.geometryToTriangles(geometry);
@@ -16457,6 +17250,7 @@ var SpriteLoader = /*#__PURE__*/ function(AbstractPlugin) {
         if (inputCount === void 0) inputCount = 0;
         this.onPlayablePlayFlag = true;
         this.onPlayablePauseFlag = false;
+        this.duration = 0;
         this.destroyed = false;
         this.inputs = [];
         this.inputOuputPorts = [];
@@ -16549,6 +17343,12 @@ var SpriteLoader = /*#__PURE__*/ function(AbstractPlugin) {
     _proto.getTime = function getTime() {
         return this.time;
     };
+    _proto.setDuration = function setDuration(duration) {
+        this.duration = duration;
+    };
+    _proto.getDuration = function getDuration() {
+        return this.duration;
+    };
     _proto.getPlayState = function getPlayState() {
         return this.playState;
     };
@@ -16700,7 +17500,9 @@ var PlayableTraversalMode;
 var tempQuat$1 = new Quaternion();
 var seed$4 = 1;
 // TODO 继承 Component
-var Transform = /*#__PURE__*/ function() {
+/**
+ *
+ */ var Transform = /*#__PURE__*/ function() {
     function Transform(props, parent) {
         if (props === void 0) props = {};
         this.taggedProperties = {};
@@ -17165,7 +17967,11 @@ var Transform = /*#__PURE__*/ function() {
     return Transform;
 }();
 
-var EventEmitter = function EventEmitter() {
+/**
+ *
+ */ /**
+ * 事件监听器
+ */ var EventEmitter = function EventEmitter() {
     var _this = this;
     var _this1 = this;
     this.listeners = {};
@@ -17259,17 +18065,15 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
         /**
    * 元素动画结束时行为（如何处理元素）
    */ _this.endBehavior = EndBehavior.forward;
-        /**
-   * 元素是否可用
-   */ _this.ended = false;
-        _this.reusable = false;
         _this.type = ItemType.base;
         _this.isDuringPlay = false;
         _this.components = [];
         _this.rendererComponents = [];
         /**
-   * 元素可见性，该值的改变会触发 `handleVisibleChanged` 回调
-   * @protected
+   * 元素是否激活
+   */ _this.active = true;
+        /**
+   * 元素组件是否显示，用于批量开关元素组件
    */ _this.visible = true;
         /**
    * 元素动画的速度
@@ -17400,12 +18204,6 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
         }
     };
     /**
-   * 元素动画结束播放时回调函数
-   * @override
-   */ _proto.onEnd = function onEnd() {
-    // OVERRIDE
-    };
-    /**
    * 通过指定 r、g、b、a 值设置元素的颜色
    * @param {number} r
    * @param {number} g
@@ -17418,17 +18216,27 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
    * @param opacity - 透明度值，范围 [0,1]
    */ _proto.setOpacity = function setOpacity(opacity) {};
     /**
-   * 获取元素显隐属性
-   */ _proto.getVisible = function getVisible() {
-        return this.visible;
+   * 激活或停用 VFXItem
+   */ _proto.setActive = function setActive(value) {
+        if (this.active !== value) {
+            this.active = !!value;
+            this.onActiveChanged();
+        }
     };
     /**
-   * 设置元素显隐属性 会触发 `handleVisibleChanged` 回调
+   * 设置元素的显隐，该设置会批量开关元素组件
    */ _proto.setVisible = function setVisible(visible) {
-        if (this.visible !== visible) {
-            this.visible = !!visible;
-            this.onActiveChanged();
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.components), _step; !(_step = _iterator()).done;){
+            var component = _step.value;
+            component.enabled = visible;
         }
+        this.visible = visible;
+    };
+    /**
+   * 元素组件显隐状态
+   * @deprecated use isVisible instead
+   */ _proto.getVisible = function getVisible() {
+        return this.visible;
     };
     /**
    * 获取元素变换包括位置、旋转、缩放
@@ -17510,14 +18318,6 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
         this.transform.assignWorldTRS(pos);
         return pos;
     };
-    /**
-   * 是否到达元素的结束时间
-   * @param now
-   * @returns
-   */ _proto.isEnded = function isEnded(now) {
-        // at least 1 ms
-        return now - this.duration > 0.001;
-    };
     _proto.find = function find(name) {
         var _queue;
         if (this.name === name) {
@@ -17541,7 +18341,7 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
    * @internal
    */ _proto.beginPlay = function beginPlay() {
         this.isDuringPlay = true;
-        if (this.composition && this.visible && !this.isEnabled) {
+        if (this.composition && this.active && !this.isEnabled) {
             this.onEnable();
         }
         for(var _iterator = _create_for_of_iterator_helper_loose(this.children), _step; !(_step = _iterator()).done;){
@@ -17725,25 +18525,54 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
     // }
     // }
     };
-    VFXItem.isComposition = function isComposition(item) {
+    /**
+   *
+   * @param item
+   * @returns
+   */ VFXItem.isComposition = function isComposition(item) {
         return item.type === ItemType.composition;
     };
-    VFXItem.isSprite = function isSprite(item) {
+    /**
+   *
+   * @param item
+   * @returns
+   */ VFXItem.isSprite = function isSprite(item) {
         return item.type === ItemType.sprite;
     };
-    VFXItem.isParticle = function isParticle(item) {
+    /**
+   *
+   * @param item
+   * @returns
+   */ VFXItem.isParticle = function isParticle(item) {
         return item.type === ItemType.particle;
     };
-    VFXItem.isNull = function isNull(item) {
+    /**
+   *
+   * @param item
+   * @returns
+   */ VFXItem.isNull = function isNull(item) {
         return item.type === ItemType.null;
     };
-    VFXItem.isTree = function isTree(item) {
+    /**
+   *
+   * @param item
+   * @returns
+   */ VFXItem.isTree = function isTree(item) {
         return item.type === ItemType.tree;
     };
-    VFXItem.isCamera = function isCamera(item) {
+    /**
+   *
+   * @param item
+   * @returns
+   */ VFXItem.isCamera = function isCamera(item) {
         return item.type === ItemType.camera;
     };
-    VFXItem.isAncestor = function isAncestor(ancestorCandidate, descendantCandidate) {
+    /**
+   *
+   * @param ancestorCandidate
+   * @param descendantCandidate
+   * @returns
+   */ VFXItem.isAncestor = function isAncestor(ancestorCandidate, descendantCandidate) {
         var current = descendantCandidate.parent;
         while(current){
             if (current === ancestorCandidate) {
@@ -17788,6 +18617,22 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
                     }
                 }
             }
+        },
+        {
+            key: "isActive",
+            get: /**
+   * 当前 VFXItem 是否激活
+   */ function get() {
+                return this.active;
+            }
+        },
+        {
+            key: "isVisible",
+            get: /**
+   * 元素组件显隐状态
+   */ function get() {
+                return this.visible;
+            }
         }
     ]);
     return VFXItem;
@@ -22552,6 +23397,7 @@ var TrackAsset = /*#__PURE__*/ function(PlayableAsset) {
         for(var _iterator = _create_for_of_iterator_helper_loose(timelineClips), _step; !(_step = _iterator()).done;){
             var timelineClip = _step.value;
             var clipPlayable = this.createClipPlayable(graph, timelineClip);
+            clipPlayable.setDuration(timelineClip.duration);
             var clip = new RuntimeClip(timelineClip, clipPlayable, mixer, this);
             runtimeClips.push(clip);
             mixer.addInput(clipPlayable, 0);
@@ -22655,14 +23501,6 @@ var RuntimeClip = /*#__PURE__*/ function() {
         this.playable.setTime(clipTime);
         // 判断动画是否结束
         if (ended) {
-            if (_instanceof1(boundObject, VFXItem) && !boundObject.ended) {
-                boundObject.ended = true;
-                boundObject.onEnd();
-                if (!boundObject.compositionReusable && !boundObject.reusable) {
-                    boundObject.dispose();
-                    this.playable.dispose();
-                }
-            }
             if (this.playable.getPlayState() === PlayState.Playing) {
                 this.playable.pause();
             }
@@ -22705,26 +23543,10 @@ var ActivationMixerPlayable = /*#__PURE__*/ function(Playable) {
         }
         if (hasInput) {
             boundItem.transform.setValid(true);
-            this.showRendererComponents(boundItem);
+            boundItem.setActive(true);
         } else {
             boundItem.transform.setValid(false);
-            this.hideRendererComponents(boundItem);
-        }
-    };
-    _proto.hideRendererComponents = function hideRendererComponents(item) {
-        for(var _iterator = _create_for_of_iterator_helper_loose(item.rendererComponents), _step; !(_step = _iterator()).done;){
-            var rendererComponent = _step.value;
-            if (rendererComponent.enabled) {
-                rendererComponent.enabled = false;
-            }
-        }
-    };
-    _proto.showRendererComponents = function showRendererComponents(item) {
-        for(var _iterator = _create_for_of_iterator_helper_loose(item.rendererComponents), _step; !(_step = _iterator()).done;){
-            var rendererComponent = _step.value;
-            if (!rendererComponent.enabled) {
-                rendererComponent.enabled = true;
-            }
+            boundItem.setActive(false);
         }
     };
     return ActivationMixerPlayable;
@@ -22752,7 +23574,7 @@ var PropertyClipPlayable = /*#__PURE__*/ function(Playable) {
     }
     var _proto = PropertyClipPlayable.prototype;
     _proto.processFrame = function processFrame(context) {
-        this.value = this.curve.getValue(this.time);
+        this.value = this.curve.getValue(this.time / this.getDuration());
     };
     return PropertyClipPlayable;
 }(Playable);
@@ -23270,9 +24092,6 @@ var SerializationHelper = /*#__PURE__*/ function() {
             var track = _step.value;
             var boundObject = track.boundObject;
             if (_instanceof1(boundObject, VFXItem)) {
-                if (_instanceof1(track, ObjectBindingTrack)) {
-                    boundObject.reusable = value;
-                }
                 var subCompositionComponent = boundObject.getComponent(CompositionComponent);
                 if (subCompositionComponent) {
                     subCompositionComponent.setReusable(value);
@@ -23317,16 +24136,16 @@ var SerializationHelper = /*#__PURE__*/ function() {
             }
         }
     };
-    _proto.showItems = function showItems() {
+    _proto.onEnable = function onEnable() {
         for(var _iterator = _create_for_of_iterator_helper_loose(this.items), _step; !(_step = _iterator()).done;){
             var item = _step.value;
-            item.setVisible(true);
+            item.setActive(true);
         }
     };
-    _proto.hideItems = function hideItems() {
+    _proto.onDisable = function onDisable() {
         for(var _iterator = _create_for_of_iterator_helper_loose(this.items), _step; !(_step = _iterator()).done;){
             var item = _step.value;
-            item.setVisible(false);
+            item.setActive(false);
         }
     };
     _proto.onDestroy = function onDestroy() {
@@ -23342,7 +24161,7 @@ var SerializationHelper = /*#__PURE__*/ function() {
     _proto.hitTest = function hitTest(ray, x, y, regions, force, options) {
         var _this, _loop = function(i) {
             var item = _this.items[i];
-            if (item.getVisible() && item.transform.getValid() && !VFXItem.isComposition(item) && !skip(item)) {
+            if (item.isActive && item.transform.getValid() && !VFXItem.isComposition(item) && !skip(item)) {
                 var hitParams = item.getHitTestParams(force);
                 if (hitParams) {
                     var success = false;
@@ -23484,9 +24303,9 @@ var SubCompositionMixerPlayable = /*#__PURE__*/ function(Playable) {
             }
         }
         if (hasInput) {
-            compositionComponent.showItems();
+            compositionComponent.item.setActive(true);
         } else {
-            compositionComponent.hideItems();
+            compositionComponent.item.setActive(false);
         }
     };
     return SubCompositionMixerPlayable;
@@ -24151,6 +24970,8 @@ var TextComponent = /*#__PURE__*/ function(BaseRenderComponent) {
         /**
    * 文本行数
    */ _this.lineCount = 0;
+        _this.SCALE_FACTOR = 0.1;
+        _this.ALPHA_FIX_VALUE = 1 / 255;
         _this.name = "MText" + seed$2++;
         _this.geometry = _this.createGeometry(glContext.TRIANGLES);
         if (props) {
@@ -24516,7 +25337,7 @@ var TextComponentBase = /*#__PURE__*/ function() {
         }
         //与 toDataURL() 两种方式都需要像素读取操作
         var imageData = context.getImageData(0, 0, this.canvas.width, this.canvas.height);
-        this.material.setTexture("uSampler0", Texture.createWithData(this.engine, {
+        this.material.setTexture("_MainTex", Texture.createWithData(this.engine, {
             data: new Uint8Array(imageData.data),
             width: imageData.width,
             height: imageData.height
@@ -27714,7 +28535,7 @@ var listOrder = 0;
             var itemProps = sourceItemData;
             if (passRenderLevel(sourceItemData.renderLevel, this.renderLevel)) {
                 itemProps.listIndex = listOrder++;
-                if (itemProps.type === ItemType.sprite || itemProps.type === ItemType.particle) {
+                if (itemProps.type === ItemType.sprite || itemProps.type === ItemType.particle || itemProps.type === ItemType.spine) {
                     for(var _iterator2 = _create_for_of_iterator_helper_loose(itemProps.components), _step2; !(_step2 = _iterator2()).done;){
                         var componentPath = _step2.value;
                         var componentData = componentMap[componentPath.id];
@@ -27810,13 +28631,18 @@ var listOrder = 0;
     return CompositionSourceManager;
 }();
 
-var SceneTicking = /*#__PURE__*/ function() {
+/**
+ *
+ */ var SceneTicking = /*#__PURE__*/ function() {
     function SceneTicking() {
         this.update = new UpdateTickData();
         this.lateUpdate = new LateUpdateTickData();
     }
     var _proto = SceneTicking.prototype;
-    _proto.addComponent = function addComponent(obj) {
+    /**
+   *
+   * @param obj
+   */ _proto.addComponent = function addComponent(obj) {
         if (obj.onUpdate !== Component.prototype.onUpdate) {
             this.update.addComponent(obj);
         }
@@ -27824,7 +28650,10 @@ var SceneTicking = /*#__PURE__*/ function() {
             this.lateUpdate.addComponent(obj);
         }
     };
-    _proto.removeComponent = function removeComponent(obj) {
+    /**
+   *
+   * @param obj
+   */ _proto.removeComponent = function removeComponent(obj) {
         if (obj.onUpdate !== Component.prototype.onUpdate) {
             this.update.removeComponent(obj);
         }
@@ -27832,7 +28661,9 @@ var SceneTicking = /*#__PURE__*/ function() {
             this.lateUpdate.removeComponent(obj);
         }
     };
-    _proto.clear = function clear() {
+    /**
+   *
+   */ _proto.clear = function clear() {
         this.update.clear();
         this.lateUpdate.clear();
     };
@@ -27923,11 +28754,16 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
         var _this;
         var _scene_jsonScene_renderSettings;
         _this = EventEmitter.call(this) || this;
-        _this.sceneTicking = new SceneTicking();
+        /**
+   *
+   */ _this.sceneTicking = new SceneTicking();
         /**
    * 动画播放速度
    */ _this.speed = 1;
         /**
+   * 合成是否结束
+   */ _this.isEnded = false;
+        /**
    * 用于保存与当前合成相关的插件数据
    */ _this.loaderData = {};
         /**
@@ -27949,6 +28785,7 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
    * 合成暂停/播放 标识
    */ _this.paused = false;
         _this.lastVideoUpdateTime = 0;
+        _this.isEndCalled = false;
         var _props_reusable = props.reusable, reusable = _props_reusable === void 0 ? false : _props_reusable, _props_speed = props.speed, speed = _props_speed === void 0 ? 1 : _props_speed, _props_baseRenderOrder = props.baseRenderOrder, baseRenderOrder = _props_baseRenderOrder === void 0 ? 0 : _props_baseRenderOrder, renderer = props.renderer, event = props.event, width = props.width, height = props.height, handleItemMessage = props.handleItemMessage;
         _this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
         if (reusable) {
@@ -28038,7 +28875,7 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
    * @param visible - 是否可见
    */ _proto.setVisible = function setVisible(visible) {
         this.items.forEach(function(item) {
-            item.setVisible(visible);
+            item.setActive(visible);
         });
     };
     /**
@@ -28048,7 +28885,7 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
         return this.speed;
     };
     _proto.play = function play() {
-        if (this.rootItem.ended && this.reusable) {
+        if (this.isEnded && this.reusable) {
             this.restart();
         }
         if (this.rootComposition.isStartCalled) {
@@ -28139,7 +28976,8 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
    * 重置状态函数
    */ _proto.reset = function reset() {
         this.rendererOptions = null;
-        this.rootItem.ended = false;
+        this.isEnded = false;
+        this.isEndCalled = false;
         this.rootComposition.time = 0;
         this.pluginSystem.resetComposition(this, this.renderFrame);
     };
@@ -28191,12 +29029,18 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
         this.sceneTicking.lateUpdate.tick(dt);
         this.updateCamera();
         this.prepareRender();
+        if (this.isEnded && !this.isEndCalled) {
+            this.isEndCalled = true;
+            this.emit("end", {
+                composition: this
+            });
+        }
         if (this.shouldDispose()) {
             this.dispose();
         }
     };
     _proto.shouldDispose = function shouldDispose() {
-        return this.rootItem.ended && this.rootItem.endBehavior === EndBehavior.destroy && !this.reusable;
+        return this.isEnded && this.rootItem.endBehavior === EndBehavior.destroy && !this.reusable;
     };
     _proto.getUpdateTime = function getUpdateTime(t) {
         var startTimeInMs = this.startTime * 1000;
@@ -28287,11 +29131,11 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
    */ _proto.updateRootComposition = function updateRootComposition(deltaTime) {
         if (this.rootComposition.isActiveAndEnabled) {
             var localTime = this.time + deltaTime - this.rootItem.start;
-            var ended = false;
+            var isEnded = false;
             var duration = this.rootItem.duration;
             var endBehavior = this.rootItem.endBehavior;
             if (localTime - duration > 0.001) {
-                ended = true;
+                isEnded = true;
                 switch(endBehavior){
                     case EndBehavior.restart:
                         {
@@ -28315,11 +29159,14 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
                 }
             }
             this.rootComposition.time = localTime;
-            if (ended && !this.rootItem.ended) {
-                this.rootItem.ended = true;
-                this.emit("end", {
-                    composition: this
-                });
+            // end state changed, handle onEnd flags
+            if (this.isEnded !== isEnded) {
+                if (isEnded) {
+                    this.isEnded = true;
+                } else {
+                    this.isEnded = false;
+                    this.isEndCalled = false;
+                }
             }
         }
     };
@@ -30645,7 +31492,7 @@ registerPlugin("sprite", SpriteLoader, VFXItem, true);
 registerPlugin("particle", ParticleLoader, VFXItem, true);
 registerPlugin("cal", CalculateLoader, VFXItem, true);
 registerPlugin("interact", InteractLoader, VFXItem, true);
-var version$1 = "2.1.0-alpha.9";
+var version$1 = "2.1.0-beta.0";
 logger.info("Core version: " + version$1 + ".");
 
 var _obj;
@@ -30681,22 +31528,7 @@ var _obj3;
  * 必须初始化的 uniform 的 map 对象（THREE 必须在初始化的时候赋值）
  */ var TEXTURE_UNIFORM_MAP = [
     "uMaskTex",
-    "uSampler0",
-    "uSampler1",
-    "uSampler2",
-    "uSampler3",
-    "uSampler4",
-    "uSampler5",
-    "uSampler6",
-    "uSampler7",
-    "uSampler8",
-    "uSampler9",
-    "uSampler10",
-    "uSampler11",
-    "uSampler12",
-    "uSampler13",
-    "uSampler14",
-    "uSampler15",
+    "_MainTex",
     "uColorOverLifetime",
     "uColorOverTrail"
 ];
@@ -30727,9 +31559,7 @@ var _obj3;
             vertex: (_shader_vertex = shader == null ? void 0 : shader.vertex) != null ? _shader_vertex : "",
             fragment: (_shader_fragment = shader == null ? void 0 : shader.fragment) != null ? _shader_fragment : ""
         });
-        for(var i = 0; i < maxSpriteMeshItemCount; i++){
-            _this.uniforms["uSampler" + i] = new THREE.Uniform(null);
-        }
+        _this.uniforms["_MainTex"] = new THREE.Uniform(null);
         _this.uniforms["uEditorTransform"] = new THREE.Uniform([
             1,
             1,
@@ -32289,8 +33119,8 @@ setMaxSpriteMeshItemCount(8);
  */ Mesh.create = function(engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.1.0-alpha.9";
+var version = "2.1.0-beta.0";
 logger.info("THREEJS plugin version: " + version + ".");
 
-export { AbstractPlugin, ActivationPlayable, ActivationPlayableAsset, ActivationTrack, AnimationClip, AnimationClipPlayable, Asset, AssetLoader, AssetManager, BYTES_TYPE_MAP, BaseRenderComponent, Behaviour, BezierCurve, BezierCurvePath, BezierCurveQuat, BinaryAsset, COMPRESSED_TEXTURE, CONSTANT_MAP_BLEND, CONSTANT_MAP_DEPTH, CONSTANT_MAP_STENCIL_FUNC, CONSTANT_MAP_STENCIL_OP, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateLoader, Camera, CameraController, CameraVFXItemLoader, ColorCurve, ColorPropertyTrack, Component, ComponentShapeType, Composition, CompositionComponent, CompositionSourceManager, DEFAULT_FONTS, DEFAULT_FPS, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, EffectsPackage, Engine, EventEmitter, EventSystem, FilterMode, Float16ArrayWrapper, FloatPropertyPlayableAsset, FloatPropertyTrack, Framebuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractComponent, InteractLoader, InteractMesh, Item, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, MaterialTrack, Mesh, MeshCollider, ObjectBindingTrack, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleBehaviourPlayableAsset, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, PassTextureCache, PathSegments, PluginSystem, PostProcessVolume, PropertyTrack, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderbuffer, Renderer, RendererComponent, RuntimeClip, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, Scene, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderFactory, ShaderType, ShaderVariant, ShapeComponent, ShapeConnectType, ShapePointType, SpriteColorPlayableAsset, SpriteColorTrack, SpriteComponent, SpriteLoader, StaticValue, SubCompositionPlayableAsset, SubCompositionTrack, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextComponent, TextComponentBase, TextLayout, TextLoader, TextStyle, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeEngine, ThreeMaterial, ThreeSpriteComponent, ThreeTextComponent, ThreeTexture, Ticker, TimelineAsset, TimelineClip, TimelinePlayable, TrackAsset, TrackSortWrapper, TrackType, Transform, TransformAnimationPlayable, TransformPlayableAsset, TransformTrack, VFXItem, ValueGetter, Vector4Curve, Vector4PropertyTrack, addByOrder, addItem, addItemWithOrder, applyMixins, assertExist, asserts, base64ToFile, blend, calculateTranslation, canvasPool, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, createCopyShader, createGLContext, createKeyFrameMeta, createShape, createValueGetter, decimalEqual, defaultPlugins, deserializeMipmapTexture, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureFixedNumber, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, generateTransparentTexture, generateWhiteTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, glType2VertexFormatType, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAlipayMiniApp, isAndroid, isArray, isCanvas, isFunction, isIOS, isIOSByUA, isMiniProgram, isObject, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isValidFontFamily, isWebGL2, isWechatMiniApp, itemFrag, itemFrameFrag, itemVert, loadAVIFOptional, loadBinary, loadBlob, loadImage, loadMedia, loadVideo, loadWebPOptional, logger, index as math, maxSpriteMeshItemCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, normalizeColor, numberToFix, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap$1 as particleOriginTranslateMap, particleUniformTypeMap, particleVert, passRenderLevel, pluginLoaderMap, randomInRange, registerPlugin, removeItem, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index$1 as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecFill, vecMulCombine, version, vertexFormatType2GLType };
+export { AbstractPlugin, ActivationPlayable, ActivationPlayableAsset, ActivationTrack, AnimationClip, AnimationClipPlayable, Asset, AssetLoader, AssetManager, BYTES_TYPE_MAP, BaseRenderComponent, Behaviour, BezierCurve, BezierCurvePath, BezierCurveQuat, BinaryAsset, COMPRESSED_TEXTURE, CONSTANT_MAP_BLEND, CONSTANT_MAP_DEPTH, CONSTANT_MAP_STENCIL_FUNC, CONSTANT_MAP_STENCIL_OP, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateLoader, Camera, CameraController, CameraVFXItemLoader, ColorCurve, ColorPropertyTrack, Component, Composition, CompositionComponent, CompositionSourceManager, DEFAULT_FONTS, DEFAULT_FPS, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, EffectsPackage, Engine, EventEmitter, EventSystem, Fake3DAnimationMode, Fake3DComponent, FilterMode, Float16ArrayWrapper, FloatPropertyPlayableAsset, FloatPropertyTrack, Framebuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractComponent, InteractLoader, InteractMesh, Item, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, MaterialTrack, Mesh, MeshCollider, ObjectBindingTrack, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleBehaviourPlayableAsset, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, PassTextureCache, PathSegments, PluginSystem, PostProcessVolume, PropertyTrack, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderbuffer, Renderer, RendererComponent, RuntimeClip, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, Scene, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderFactory, ShaderType, ShaderVariant, ShapeComponent, ShapeConnectType, ShapePointType, ShapePrimitiveType, SpriteColorPlayableAsset, SpriteColorTrack, SpriteComponent, SpriteLoader, StaticValue, SubCompositionPlayableAsset, SubCompositionTrack, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextComponent, TextComponentBase, TextLayout, TextLoader, TextStyle, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeEngine, ThreeMaterial, ThreeSpriteComponent, ThreeTextComponent, ThreeTexture, Ticker, TimelineAsset, TimelineClip, TimelinePlayable, TrackAsset, TrackSortWrapper, TrackType, Transform, TransformAnimationPlayable, TransformPlayableAsset, TransformTrack, VFXItem, ValueGetter, Vector4Curve, Vector4PropertyTrack, addByOrder, addItem, addItemWithOrder, applyMixins, assertExist, asserts, base64ToFile, blend, calculateTranslation, canvasPool, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, createCopyShader, createGLContext, createKeyFrameMeta, createShape, createValueGetter, decimalEqual, defaultPlugins, deserializeMipmapTexture, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureFixedNumber, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, generateTransparentTexture, generateWhiteTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, glType2VertexFormatType, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAlipayMiniApp, isAndroid, isArray, isCanvas, isFunction, isIOS, isIOSByUA, isMiniProgram, isObject, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isValidFontFamily, isWebGL2, isWechatMiniApp, itemFrag, itemFrameFrag, itemVert, loadAVIFOptional, loadBinary, loadBlob, loadImage, loadMedia, loadVideo, loadWebPOptional, logger, index as math, maxSpriteMeshItemCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, normalizeColor, numberToFix, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap$1 as particleOriginTranslateMap, particleUniformTypeMap, particleVert, passRenderLevel, pluginLoaderMap, randomInRange, registerPlugin, removeItem, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index$1 as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecFill, vecMulCombine, version, vertexFormatType2GLType };
 //# sourceMappingURL=index.mjs.map