@galacean/effects-plugin-editor-gizmo 2.7.4 → 2.8.0-alpha.1

package/dist/index.mjs

@@ -3,11 +3,11 @@
  * Description: Galacean Effects player editor gizmo plugin
  * Author: Ant Group CO., Ltd.
  * Contributors: 茂安,旻诺
- * Version: v2.7.4
+ * Version: v2.8.0-alpha.1
  */
 
 import * as EFFECTS from '@galacean/effects';
-import { math, DestroyOptions, glContext, GLSLVersion, Material, Mesh, GLGeometry, Texture, noop, Geometry, Transform, serialize, effectsClass, RendererComponent, ParticleSystemRenderer, assertExist, HitTestType, spec, removeItem, RenderPass, RenderPassPriorityPostprocess, TextureLoadAction, RenderPassPriorityPrepare, AbstractPlugin, registerPlugin, VFXItem, logger } from '@galacean/effects';
+import { glContext, Texture, noop, math, Geometry, Transform, Mesh, Material, DestroyOptions, GLSLVersion, GLGeometry, serialize, effectsClass, RendererComponent, ParticleSystemRenderer, assertExist, TextureLoadAction, HitTestType, spec, RenderPassPriorityPostprocess, RenderPass, RenderPassPriorityPrepare, AbstractPlugin, registerPlugin, VFXItem, logger } from '@galacean/effects';
 
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
     try {
@@ -201,228 +201,6 @@ typeof SuppressedError === "function" ? SuppressedError : function _SuppressedEr
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-var GizmoVFXItemType = "gizmo";
-var GizmoSubType;
-(function(GizmoSubType) {
-    GizmoSubType[GizmoSubType["particleEmitter"] = 1] = "particleEmitter";
-    GizmoSubType[GizmoSubType["modelWireframe"] = 2] = "modelWireframe";
-    GizmoSubType[GizmoSubType["box"] = 3] = "box";
-    GizmoSubType[GizmoSubType["sphere"] = 4] = "sphere";
-    GizmoSubType[GizmoSubType["cylinder"] = 5] = "cylinder";
-    GizmoSubType[GizmoSubType["cone"] = 6] = "cone";
-    GizmoSubType[GizmoSubType["torus"] = 7] = "torus";
-    GizmoSubType[GizmoSubType["sprite"] = 8] = "sprite";
-    GizmoSubType[GizmoSubType["plane"] = 9] = "plane";
-    GizmoSubType[GizmoSubType["rotation"] = 10] = "rotation";
-    GizmoSubType[GizmoSubType["translation"] = 11] = "translation";
-    GizmoSubType[GizmoSubType["scale"] = 12] = "scale";
-    GizmoSubType[GizmoSubType["viewHelper"] = 13] = "viewHelper";
-    GizmoSubType[GizmoSubType["camera"] = 14] = "camera";
-    GizmoSubType[GizmoSubType["frustum"] = 15] = "frustum";
-    GizmoSubType[GizmoSubType["light"] = 16] = "light";
-    GizmoSubType[GizmoSubType["directionLight"] = 17] = "directionLight";
-    GizmoSubType[GizmoSubType["pointLight"] = 18] = "pointLight";
-    GizmoSubType[GizmoSubType["spotLight"] = 19] = "spotLight";
-    GizmoSubType[GizmoSubType["boundingBox"] = 20] = "boundingBox";
-    GizmoSubType[GizmoSubType["floorGrid"] = 21] = "floorGrid";
-})(GizmoSubType || (GizmoSubType = {}));
-
-function _extends() {
-    _extends = Object.assign || function assign(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source)if (Object.prototype.hasOwnProperty.call(source, key)) target[key] = source[key];
-        }
-        return target;
-    };
-    return _extends.apply(this, arguments);
-}
-
-var Vector4 = math.Vector4;
-var WireframeGeometryType;
-(function(WireframeGeometryType) {
-    WireframeGeometryType[WireframeGeometryType["triangle"] = 0] = "triangle";
-    WireframeGeometryType[WireframeGeometryType["quad"] = 1] = "quad";
-})(WireframeGeometryType || (WireframeGeometryType = {}));
-function destroyWireframeMesh(mesh) {
-    var _mesh_geometry;
-    (_mesh_geometry = mesh.geometry) == null ? void 0 : _mesh_geometry.dispose();
-    mesh.dispose({
-        geometries: DestroyOptions.keep
-    });
-}
-function updateWireframeMesh(originGeometry, originMaterial, wireframe, type) {
-    wireframe.material.cloneUniforms(originMaterial);
-    var geometry = originGeometry;
-    var wireframeGeometry = wireframe.firstGeometry();
-    for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(originMaterial.enabledMacros)), _step; !(_step = _iterator()).done;){
-        var macro = _step.value;
-        wireframe.material.enableMacro(macro, originMaterial.enabledMacros[macro]);
-    }
-    if (type === 0) {
-        // 线框模式不绘制模型的时候，drawCount 为负数
-        var drawCount = Math.abs(geometry.getDrawCount());
-        if (drawCount !== 0) {
-            if (drawCount !== wireframeGeometry.getDrawCount() / 2) {
-                var indexData = geometry.getIndexData();
-                var data = indexData ? getTriangleIndexData(indexData) : getTriangleIndexDataByCount(drawCount);
-                wireframeGeometry.setIndexData(data);
-                wireframeGeometry.setDrawCount(data.length);
-            }
-        }
-    } else if (type === 1) {
-        if (geometry.getDrawCount() / 6 !== wireframeGeometry.getDrawCount() / 8) {
-            var data1 = getQuadIndexData(geometry.getDrawCount() / 6, geometry.getIndexData());
-            wireframeGeometry.setIndexData(data1);
-            wireframeGeometry.setDrawCount(data1.length);
-        }
-    }
-    return wireframe;
-}
-function getQuadIndexData(faceCount, oid) {
-    var indexData = new Uint16Array(faceCount * 8);
-    for(var i = 0; i < faceCount; i++){
-        var idx = i * 8;
-        var base = i * 4;
-        indexData[idx] = base;
-        indexData[idx + 1] = 1 + base;
-        indexData[idx + 2] = 1 + base;
-        indexData[idx + 3] = 3 + base;
-        indexData[idx + 4] = 3 + base;
-        indexData[idx + 5] = 2 + base;
-        indexData[idx + 6] = 2 + base;
-        indexData[idx + 7] = base;
-    }
-    return indexData;
-}
-function createModeWireframe(engine, mesh, color) {
-    var geometry = new SharedGeometry(engine, {
-        geometry: mesh.firstGeometry(),
-        mode: glContext.LINES,
-        index: {
-            data: new Uint32Array(0)
-        }
-    });
-    var _mesh_material_shader_shaderData = mesh.material.shader.shaderData, vertex = _mesh_material_shader_shaderData.vertex, fragment = _mesh_material_shader_shaderData.fragment;
-    var materialOptions = _extends({}, mesh.material.props);
-    var newMacros = [
-        [
-            "PREVIEW_BORDER",
-            1
-        ]
-    ];
-    var _mesh_name;
-    materialOptions.shader = {
-        vertex: vertex,
-        fragment: fragment,
-        macros: newMacros,
-        shared: true,
-        name: ((_mesh_name = mesh.name) != null ? _mesh_name : "unamedmesh") + "_wireframe",
-        glslVersion: engine.gpuCapability.level === 2 ? GLSLVersion.GLSL3 : GLSLVersion.GLSL1
-    };
-    var material = Material.create(engine, materialOptions);
-    material.depthTest = true;
-    material.setVector4("uPreviewColor", new Vector4(color[0], color[1], color[2], 1));
-    return updateWireframeMesh(mesh.geometry, mesh.material, Mesh.create(engine, {
-        geometry: geometry,
-        material: material,
-        priority: 3000,
-        name: materialOptions.shader.name
-    }), 0);
-}
-function getTriangleIndexDataByCount(drawCount) {
-    var faceCount = drawCount / 3;
-    var indexData = new Uint32Array(faceCount * 6);
-    for(var i = 0; i < faceCount; i++){
-        var idx = i * 6;
-        var p0 = i * 3;
-        var p1 = p0 + 1;
-        var p2 = p0 + 2;
-        indexData[idx] = p0;
-        indexData[idx + 1] = p1;
-        indexData[idx + 2] = p1;
-        indexData[idx + 3] = p2;
-        indexData[idx + 4] = p2;
-        indexData[idx + 5] = p0;
-    }
-    return indexData;
-}
-function getTriangleIndexData(oid) {
-    var faceCount = oid.length / 3;
-    var indexData = new Uint32Array(faceCount * 6);
-    for(var i = 0; i < faceCount; i++){
-        var idx = i * 6;
-        var base = i * 3;
-        var p0 = oid[base];
-        var p1 = oid[base + 1];
-        var p2 = oid[base + 2];
-        indexData[idx] = p0;
-        indexData[idx + 1] = p1;
-        indexData[idx + 2] = p1;
-        indexData[idx + 3] = p2;
-        indexData[idx + 4] = p2;
-        indexData[idx + 5] = p0;
-    }
-    return indexData;
-}
-var SharedGeometry = /*#__PURE__*/ function(GLGeometry) {
-    _inherits(SharedGeometry, GLGeometry);
-    function SharedGeometry(engine, options) {
-        var _this;
-        _this = GLGeometry.call(this, engine, _extends({
-            attributes: {}
-        }, options)) || this;
-        var indexData = options.index ? options.index.data : options.geometry.getIndexData();
-        if (indexData) {
-            //@ts-expect-error safe to assign
-            indexData = new indexData.constructor(indexData);
-        }
-        _this.indices = indexData;
-        _this.source = options.geometry;
-        _this.drawCount = options.drawCount || 0;
-        _this.drawStart = options.drawStart || 0;
-        _this.mode = options.mode || 0;
-        for(var name in _this.source.attributes){
-            _this.attributes[name] = _extends({}, _this.source.attributes[name]);
-        }
-        return _this;
-    }
-    var _proto = SharedGeometry.prototype;
-    _proto.initialize = function initialize() {
-        if (!this.isInitialized) {
-            var geometry = this.source;
-            geometry.initialize();
-            //this.indicesBuffer = this._source.indicesBuffer;
-            this.buffers = this.source.buffers;
-            this.bufferProps = this.source.bufferProps;
-            //this.dirtyFlags = this._source.dirtyFlags;
-            //this.vaos = this._source.vaos;
-            //创建ibo
-            if (this.indices) {
-                this.indicesBuffer = this.createIndicesBuffer(this.indices);
-            }
-            this.flush();
-            this.initialized = true;
-        }
-    };
-    _proto.getAttributeNames = function getAttributeNames() {
-        return this.source.getAttributeNames();
-    };
-    _proto.flush = function flush() {
-        this.source.flush();
-        GLGeometry.prototype.flush.call(this);
-    };
-    _proto.dispose = function dispose() {
-        // from source geometry
-        this.buffers = {};
-        this.bufferProps = {};
-        GLGeometry.prototype.dispose.call(this);
-        // @ts-expect-error
-        this.source = null;
-    };
-    return SharedGeometry;
-}(GLGeometry);
-
 // 坐标轴默认颜色
 var color = {
     xAxisColor: [
@@ -507,6 +285,121 @@ function _createImage() {
     return currentPos.clone().add(vecItemScaler);
 }
 
+var GizmoSubType;
+(function(GizmoSubType) {
+    GizmoSubType[GizmoSubType["particleEmitter"] = 1] = "particleEmitter";
+    GizmoSubType[GizmoSubType["modelWireframe"] = 2] = "modelWireframe";
+    GizmoSubType[GizmoSubType["box"] = 3] = "box";
+    GizmoSubType[GizmoSubType["sphere"] = 4] = "sphere";
+    GizmoSubType[GizmoSubType["cylinder"] = 5] = "cylinder";
+    GizmoSubType[GizmoSubType["cone"] = 6] = "cone";
+    GizmoSubType[GizmoSubType["torus"] = 7] = "torus";
+    GizmoSubType[GizmoSubType["sprite"] = 8] = "sprite";
+    GizmoSubType[GizmoSubType["plane"] = 9] = "plane";
+    GizmoSubType[GizmoSubType["rotation"] = 10] = "rotation";
+    GizmoSubType[GizmoSubType["translation"] = 11] = "translation";
+    GizmoSubType[GizmoSubType["scale"] = 12] = "scale";
+    GizmoSubType[GizmoSubType["viewHelper"] = 13] = "viewHelper";
+    GizmoSubType[GizmoSubType["camera"] = 14] = "camera";
+    GizmoSubType[GizmoSubType["frustum"] = 15] = "frustum";
+    GizmoSubType[GizmoSubType["light"] = 16] = "light";
+    GizmoSubType[GizmoSubType["directionLight"] = 17] = "directionLight";
+    GizmoSubType[GizmoSubType["pointLight"] = 18] = "pointLight";
+    GizmoSubType[GizmoSubType["spotLight"] = 19] = "spotLight";
+    GizmoSubType[GizmoSubType["boundingBox"] = 20] = "boundingBox";
+    GizmoSubType[GizmoSubType["floorGrid"] = 21] = "floorGrid";
+})(GizmoSubType || (GizmoSubType = {}));
+
+math.Vector3; math.Ray;
+var BoundingType;
+(function(BoundingType) {
+    BoundingType[BoundingType["box"] = 0] = "box";
+    BoundingType[BoundingType["sphere"] = 1] = "sphere";
+    BoundingType[BoundingType["triangle"] = 2] = "triangle";
+    BoundingType[BoundingType["line"] = 3] = "line";
+})(BoundingType || (BoundingType = {}));
+
+var Matrix4$5 = math.Matrix4, Vector2$2 = math.Vector2;
+function distanceOfPointAndLine(point, line) {
+    //三角形三个边长
+    var AC = new Vector2$2();
+    var BC = new Vector2$2();
+    var AB = new Vector2$2();
+    AC.subtractVectors(point, line[0]);
+    BC.subtractVectors(point, line[1]);
+    AB.subtractVectors(line[1], line[0]);
+    var lengthAC = AC.length();
+    var lengthBC = BC.length();
+    var lengthAB = AB.length();
+    //利用海伦公式计算三角形面积
+    //周长的一半
+    var P = (lengthAC + lengthBC + lengthAB) / 2;
+    var allArea = Math.abs(Math.sqrt(P * (P - lengthAC) * (P - lengthBC) * (P - lengthAB)));
+    //普通公式计算三角形面积反推点到线的垂直距离
+    var distance = 2 * allArea / lengthAB;
+    var l1 = Math.sqrt(Math.pow(lengthAC, 2) - Math.pow(distance, 2));
+    var l2 = Math.sqrt(Math.pow(lengthBC, 2) - Math.pow(distance, 2));
+    var isInLine = false;
+    if (l1 <= lengthAB && l2 <= lengthAB) {
+        isInLine = true;
+    }
+    return {
+        distance: distance,
+        isInLine: isInLine
+    };
+}
+function projectionOfPointAndLine(point, line) {
+    var AC = new Vector2$2();
+    var BC = new Vector2$2();
+    var AB = new Vector2$2();
+    var line0 = line[0].toVector2();
+    var line1 = line[1].toVector2();
+    AC.subtractVectors(point, line0);
+    BC.subtractVectors(point, line1);
+    AB.subtractVectors(line1, line0);
+    var lengthAC = AC.length();
+    var lengthBC = BC.length();
+    var lengthAB = AB.length();
+    //利用海伦公式计算三角形面积
+    //周长的一半
+    var P = (lengthAC + lengthBC + lengthAB) / 2;
+    var allArea = Math.abs(Math.sqrt(P * (P - lengthAC) * (P - lengthBC) * (P - lengthAB)));
+    //普通公式计算三角形面积反推点到线的垂直距离
+    var distance = 2 * allArea / lengthAB;
+    var l1 = Math.sqrt(Math.pow(lengthAC, 2) - Math.pow(distance, 2));
+    var l2 = Math.sqrt(Math.pow(lengthBC, 2) - Math.pow(distance, 2));
+    var worldAB = line[1].clone().subtract(line[0]);
+    var worldAP = worldAB.clone().multiply(l1 / (l1 + l2));
+    var worldP = line[0].clone().add(worldAP);
+    return worldP;
+}
+function computeOrthographicOffCenter(left, right, bottom, top, near, far) {
+    var a = 1.0 / (right - left);
+    var b = 1.0 / (top - bottom);
+    var c = 1.0 / (far - near);
+    var tx = -(right + left) * a;
+    var ty = -(top + bottom) * b;
+    var tz = -(far + near) * c;
+    a *= 2.0;
+    b *= 2.0;
+    c *= -2.0;
+    return new Matrix4$5(a, 0.0, 0.0, 0.0, //
+    0.0, b, 0.0, 0.0, //
+    0.0, 0.0, c, 0.0, //
+    tx, ty, tz, 1.0);
+}
+
+function _extends() {
+    _extends = Object.assign || function assign(target) {
+        for(var i = 1; i < arguments.length; i++){
+            var source = arguments[i];
+            for(var key in source)if (Object.prototype.hasOwnProperty.call(source, key)) target[key] = source[key];
+        }
+        return target;
+    };
+    return _extends.apply(this, arguments);
+}
+
 /**
  * 基础几何数据[抽象类，不可以直接用来初始化]
  */ var GeometryData = /*#__PURE__*/ function() {
@@ -921,7 +814,7 @@ var Vector3$5 = math.Vector3;
     return PlaneGeometryData;
 }(GeometryData);
 
-var Euler$1 = math.Euler, Vector3$4 = math.Vector3, Matrix4$5 = math.Matrix4;
+var Euler$1 = math.Euler, Vector3$4 = math.Vector3, Matrix4$4 = math.Matrix4;
 /**
  *
  */ var FrustumGeometryData = /*#__PURE__*/ function(GeometryData) {
@@ -938,7 +831,7 @@ var Euler$1 = math.Euler, Vector3$4 = math.Vector3, Matrix4$5 = math.Matrix4;
         var point2 = new Vector3$4(-halfX, halfY, far);
         var point3 = new Vector3$4(-halfX, -halfY, far);
         var point4 = new Vector3$4(halfX, -halfY, far);
-        var matrix = Euler$1.fromArray(rotation).toMatrix4(new Matrix4$5());
+        var matrix = Euler$1.fromArray(rotation).toMatrix4(new Matrix4$4());
         var result1 = matrix.transformPoint(point1).add(position);
         var result2 = matrix.transformPoint(point2).add(position);
         var result3 = matrix.transformPoint(point3).add(position);
@@ -1161,85 +1054,6 @@ var GeometryType;
     return result;
 }
 
-math.Vector3; math.Ray;
-var BoundingType;
-(function(BoundingType) {
-    BoundingType[BoundingType["box"] = 0] = "box";
-    BoundingType[BoundingType["sphere"] = 1] = "sphere";
-    BoundingType[BoundingType["triangle"] = 2] = "triangle";
-    BoundingType[BoundingType["line"] = 3] = "line";
-})(BoundingType || (BoundingType = {}));
-
-var Matrix4$4 = math.Matrix4, Vector2$2 = math.Vector2;
-function distanceOfPointAndLine(point, line) {
-    //三角形三个边长
-    var AC = new Vector2$2();
-    var BC = new Vector2$2();
-    var AB = new Vector2$2();
-    AC.subtractVectors(point, line[0]);
-    BC.subtractVectors(point, line[1]);
-    AB.subtractVectors(line[1], line[0]);
-    var lengthAC = AC.length();
-    var lengthBC = BC.length();
-    var lengthAB = AB.length();
-    //利用海伦公式计算三角形面积
-    //周长的一半
-    var P = (lengthAC + lengthBC + lengthAB) / 2;
-    var allArea = Math.abs(Math.sqrt(P * (P - lengthAC) * (P - lengthBC) * (P - lengthAB)));
-    //普通公式计算三角形面积反推点到线的垂直距离
-    var distance = 2 * allArea / lengthAB;
-    var l1 = Math.sqrt(Math.pow(lengthAC, 2) - Math.pow(distance, 2));
-    var l2 = Math.sqrt(Math.pow(lengthBC, 2) - Math.pow(distance, 2));
-    var isInLine = false;
-    if (l1 <= lengthAB && l2 <= lengthAB) {
-        isInLine = true;
-    }
-    return {
-        distance: distance,
-        isInLine: isInLine
-    };
-}
-function projectionOfPointAndLine(point, line) {
-    var AC = new Vector2$2();
-    var BC = new Vector2$2();
-    var AB = new Vector2$2();
-    var line0 = line[0].toVector2();
-    var line1 = line[1].toVector2();
-    AC.subtractVectors(point, line0);
-    BC.subtractVectors(point, line1);
-    AB.subtractVectors(line1, line0);
-    var lengthAC = AC.length();
-    var lengthBC = BC.length();
-    var lengthAB = AB.length();
-    //利用海伦公式计算三角形面积
-    //周长的一半
-    var P = (lengthAC + lengthBC + lengthAB) / 2;
-    var allArea = Math.abs(Math.sqrt(P * (P - lengthAC) * (P - lengthBC) * (P - lengthAB)));
-    //普通公式计算三角形面积反推点到线的垂直距离
-    var distance = 2 * allArea / lengthAB;
-    var l1 = Math.sqrt(Math.pow(lengthAC, 2) - Math.pow(distance, 2));
-    var l2 = Math.sqrt(Math.pow(lengthBC, 2) - Math.pow(distance, 2));
-    var worldAB = line[1].clone().subtract(line[0]);
-    var worldAP = worldAB.clone().multiply(l1 / (l1 + l2));
-    var worldP = line[0].clone().add(worldAP);
-    return worldP;
-}
-function computeOrthographicOffCenter(left, right, bottom, top, near, far) {
-    var a = 1.0 / (right - left);
-    var b = 1.0 / (top - bottom);
-    var c = 1.0 / (far - near);
-    var tx = -(right + left) * a;
-    var ty = -(top + bottom) * b;
-    var tz = -(far + near) * c;
-    a *= 2.0;
-    b *= 2.0;
-    c *= -2.0;
-    return new Matrix4$4(a, 0.0, 0.0, 0.0, //
-    0.0, b, 0.0, 0.0, //
-    0.0, 0.0, c, 0.0, //
-    tx, ty, tz, 1.0);
-}
-
 var Vector2$1 = math.Vector2, Vector3$3 = math.Vector3, Matrix4$3 = math.Matrix4;
 /**
  * 根据 gizmoSubType 类型创建几何体 Mesh
@@ -2734,34 +2548,222 @@ function createMesh(engine, points, indices, color, depthTest, name) {
             fragment: "\n    precision mediump float;\n\n    uniform vec3 u_color;\n\n    void main(){\n      gl_FragColor = vec4(u_color,1.0);\n    }",
             vertex: "precision highp float;\n\n    attribute vec3 a_Position;\n\n    uniform mat4 u_model;\n    uniform mat4 effects_MatrixVP;\n    void main(){\n      gl_Position = effects_MatrixVP * u_model * vec4(a_Position,1.0);\n    }"
         }
-    });
-    material.setVector3("u_color", Vector3$1.fromArray(color));
-    material.setMatrix("u_model", Matrix4$1.IDENTITY);
-    material.depthTest = depthTest;
-    material.stencilTest = false;
-    material.blending = false;
-    material.depthMask = true;
-    var geometry = Geometry.create(engine, {
-        attributes: {
-            a_Position: {
-                size: 3,
-                data: points
+    });
+    material.setVector3("u_color", Vector3$1.fromArray(color));
+    material.setMatrix("u_model", Matrix4$1.IDENTITY);
+    material.depthTest = depthTest;
+    material.stencilTest = false;
+    material.blending = false;
+    material.depthMask = true;
+    var geometry = Geometry.create(engine, {
+        attributes: {
+            a_Position: {
+                size: 3,
+                data: points
+            }
+        },
+        indices: {
+            data: indices
+        },
+        mode: glContext.LINES,
+        drawCount: indices.length
+    });
+    return Mesh.create(engine, {
+        name: name,
+        geometry: geometry,
+        material: material,
+        priority: 3000
+    });
+}
+
+var Vector4 = math.Vector4;
+var WireframeGeometryType;
+(function(WireframeGeometryType) {
+    WireframeGeometryType[WireframeGeometryType["triangle"] = 0] = "triangle";
+    WireframeGeometryType[WireframeGeometryType["quad"] = 1] = "quad";
+})(WireframeGeometryType || (WireframeGeometryType = {}));
+function destroyWireframeMesh(mesh) {
+    var _mesh_geometry;
+    (_mesh_geometry = mesh.geometry) == null ? void 0 : _mesh_geometry.dispose();
+    mesh.dispose({
+        geometries: DestroyOptions.keep
+    });
+}
+function updateWireframeMesh(originGeometry, originMaterial, wireframe, type) {
+    wireframe.material.cloneUniforms(originMaterial);
+    var geometry = originGeometry;
+    var wireframeGeometry = wireframe.firstGeometry();
+    for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(originMaterial.enabledMacros)), _step; !(_step = _iterator()).done;){
+        var macro = _step.value;
+        wireframe.material.enableMacro(macro, originMaterial.enabledMacros[macro]);
+    }
+    if (type === 0) {
+        // 线框模式不绘制模型的时候，drawCount 为负数
+        var drawCount = Math.abs(geometry.getDrawCount());
+        if (drawCount !== 0) {
+            if (drawCount !== wireframeGeometry.getDrawCount() / 2) {
+                var indexData = geometry.getIndexData();
+                var data = indexData ? getTriangleIndexData(indexData) : getTriangleIndexDataByCount(drawCount);
+                wireframeGeometry.setIndexData(data);
+                wireframeGeometry.setDrawCount(data.length);
+            }
+        }
+    } else if (type === 1) {
+        if (geometry.getDrawCount() / 6 !== wireframeGeometry.getDrawCount() / 8) {
+            var data1 = getQuadIndexData(geometry.getDrawCount() / 6, geometry.getIndexData());
+            wireframeGeometry.setIndexData(data1);
+            wireframeGeometry.setDrawCount(data1.length);
+        }
+    }
+    return wireframe;
+}
+function getQuadIndexData(faceCount, oid) {
+    var indexData = new Uint16Array(faceCount * 8);
+    for(var i = 0; i < faceCount; i++){
+        var idx = i * 8;
+        var base = i * 4;
+        indexData[idx] = base;
+        indexData[idx + 1] = 1 + base;
+        indexData[idx + 2] = 1 + base;
+        indexData[idx + 3] = 3 + base;
+        indexData[idx + 4] = 3 + base;
+        indexData[idx + 5] = 2 + base;
+        indexData[idx + 6] = 2 + base;
+        indexData[idx + 7] = base;
+    }
+    return indexData;
+}
+function createModeWireframe(engine, mesh, color) {
+    var geometry = new SharedGeometry(engine, {
+        geometry: mesh.firstGeometry(),
+        mode: glContext.LINES,
+        index: {
+            data: new Uint32Array(0)
+        }
+    });
+    var _mesh_material_shader_shaderData = mesh.material.shader.shaderData, vertex = _mesh_material_shader_shaderData.vertex, fragment = _mesh_material_shader_shaderData.fragment;
+    var materialOptions = _extends({}, mesh.material.props);
+    var newMacros = [
+        [
+            "PREVIEW_BORDER",
+            1
+        ]
+    ];
+    var _mesh_name;
+    materialOptions.shader = {
+        vertex: vertex,
+        fragment: fragment,
+        macros: newMacros,
+        shared: true,
+        name: ((_mesh_name = mesh.name) != null ? _mesh_name : "unamedmesh") + "_wireframe",
+        glslVersion: engine.gpuCapability.level === 2 ? GLSLVersion.GLSL3 : GLSLVersion.GLSL1
+    };
+    var material = Material.create(engine, materialOptions);
+    material.depthTest = true;
+    material.setVector4("uPreviewColor", new Vector4(color[0], color[1], color[2], 1));
+    return updateWireframeMesh(mesh.geometry, mesh.material, Mesh.create(engine, {
+        geometry: geometry,
+        material: material,
+        priority: 3000,
+        name: materialOptions.shader.name
+    }), 0);
+}
+function getTriangleIndexDataByCount(drawCount) {
+    var faceCount = drawCount / 3;
+    var indexData = new Uint32Array(faceCount * 6);
+    for(var i = 0; i < faceCount; i++){
+        var idx = i * 6;
+        var p0 = i * 3;
+        var p1 = p0 + 1;
+        var p2 = p0 + 2;
+        indexData[idx] = p0;
+        indexData[idx + 1] = p1;
+        indexData[idx + 2] = p1;
+        indexData[idx + 3] = p2;
+        indexData[idx + 4] = p2;
+        indexData[idx + 5] = p0;
+    }
+    return indexData;
+}
+function getTriangleIndexData(oid) {
+    var faceCount = oid.length / 3;
+    var indexData = new Uint32Array(faceCount * 6);
+    for(var i = 0; i < faceCount; i++){
+        var idx = i * 6;
+        var base = i * 3;
+        var p0 = oid[base];
+        var p1 = oid[base + 1];
+        var p2 = oid[base + 2];
+        indexData[idx] = p0;
+        indexData[idx + 1] = p1;
+        indexData[idx + 2] = p1;
+        indexData[idx + 3] = p2;
+        indexData[idx + 4] = p2;
+        indexData[idx + 5] = p0;
+    }
+    return indexData;
+}
+var SharedGeometry = /*#__PURE__*/ function(GLGeometry) {
+    _inherits(SharedGeometry, GLGeometry);
+    function SharedGeometry(engine, options) {
+        var _this;
+        _this = GLGeometry.call(this, engine, _extends({
+            attributes: {}
+        }, options)) || this;
+        var indexData = options.index ? options.index.data : options.geometry.getIndexData();
+        if (indexData) {
+            //@ts-expect-error safe to assign
+            indexData = new indexData.constructor(indexData);
+        }
+        _this.indices = indexData;
+        _this.source = options.geometry;
+        _this.drawCount = options.drawCount || 0;
+        _this.drawStart = options.drawStart || 0;
+        _this.mode = options.mode || 0;
+        for(var name in _this.source.attributes){
+            _this.attributes[name] = _extends({}, _this.source.attributes[name]);
+        }
+        return _this;
+    }
+    var _proto = SharedGeometry.prototype;
+    _proto.initialize = function initialize() {
+        if (!this.isInitialized) {
+            var geometry = this.source;
+            geometry.initialize();
+            //this.indicesBuffer = this._source.indicesBuffer;
+            this.buffers = this.source.buffers;
+            this.bufferProps = this.source.bufferProps;
+            //this.dirtyFlags = this._source.dirtyFlags;
+            //this.vaos = this._source.vaos;
+            //创建ibo
+            if (this.indices) {
+                this.indicesBuffer = this.createIndicesBuffer(this.indices);
             }
-        },
-        indices: {
-            data: indices
-        },
-        mode: glContext.LINES,
-        drawCount: indices.length
-    });
-    return Mesh.create(engine, {
-        name: name,
-        geometry: geometry,
-        material: material,
-        priority: 3000
-    });
-}
+            this.flush();
+            this.initialized = true;
+        }
+    };
+    _proto.getAttributeNames = function getAttributeNames() {
+        return this.source.getAttributeNames();
+    };
+    _proto.flush = function flush() {
+        this.source.flush();
+        GLGeometry.prototype.flush.call(this);
+    };
+    _proto.dispose = function dispose() {
+        // from source geometry
+        this.buffers = {};
+        this.bufferProps = {};
+        GLGeometry.prototype.dispose.call(this);
+        // @ts-expect-error
+        this.source = null;
+    };
+    return SharedGeometry;
+}(GLGeometry);
 
+var editorRenderPassName = "editor-gizmo";
+var frontRenderPassName = "front-gizmo";
+var behindRenderPassName = "behind-gizmo";
 var Vector2 = math.Vector2, Vector3 = math.Vector3, Matrix4 = math.Matrix4, Quaternion = math.Quaternion;
 var constants = glContext;
 var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
@@ -2773,6 +2775,7 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
         _this.coordinateSpace = 0;
         _this.mat = Matrix4.fromIdentity();
         _this.wireframeMeshes = [];
+        _this.meshes = [];
         _this.mesh = null;
         /**
    * 射线检测算法
@@ -3007,11 +3010,11 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
         var gizmoSubType = this.subType;
         switch(gizmoSubType){
             case GizmoSubType.particleEmitter:
-                this.createParticleContent(targetItem, gizmoPlugin.meshToAdd);
+                this.createParticleContent(targetItem);
                 break;
             case GizmoSubType.modelWireframe:
                 this.needCreateModelContent = true;
-                this.createModelContent(targetItem, gizmoPlugin.meshToAdd);
+                this.createModelContent(targetItem);
                 break;
             case GizmoSubType.box:
             case GizmoSubType.sphere:
@@ -3024,29 +3027,111 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
             case GizmoSubType.pointLight:
             case GizmoSubType.spotLight:
             case GizmoSubType.floorGrid:
-                this.createBasicContent(targetItem, gizmoPlugin.meshToAdd, gizmoSubType);
+                this.createBasicContent(targetItem, gizmoSubType);
                 break;
             case GizmoSubType.camera:
             case GizmoSubType.light:
-                this.createBasicContent(targetItem, gizmoPlugin.meshToAdd, gizmoSubType, iconTextures);
+                this.createBasicContent(targetItem, gizmoSubType, iconTextures);
                 break;
             case GizmoSubType.rotation:
             case GizmoSubType.scale:
             case GizmoSubType.translation:
-                this.createCombinationContent(targetItem, gizmoPlugin.meshToAdd, gizmoSubType);
+                this.createCombinationContent(targetItem, gizmoSubType);
                 break;
             case GizmoSubType.viewHelper:
-                this.createCombinationContent(targetItem, gizmoPlugin.meshToAdd, gizmoSubType, iconTextures);
+                this.createCombinationContent(targetItem, gizmoSubType, iconTextures);
                 break;
             case GizmoSubType.boundingBox:
-                this.createBoundingBoxContent(targetItem, gizmoPlugin.meshToAdd);
+                this.createBoundingBoxContent(targetItem);
                 break;
         }
         composition == null ? void 0 : composition.loaderData.gizmoItems.push(this.item);
     };
+    _proto.onEnable = function onEnable() {
+        RendererComponent1.prototype.onEnable.call(this);
+        if (!this.item.composition) {
+            return;
+        }
+        var renderFrame = this.item.composition.renderFrame;
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.meshes), _step; !(_step = _iterator()).done;){
+            var mesh = _step.value;
+            if (mesh.name === GeometryType.FloorGrid.toString() || mesh.name === "Box") {
+                this.getFrontRenderPass(renderFrame).addMesh(mesh);
+            } else if (mesh.name === "translation" || mesh.name === "scale" || mesh.name === "rotation") {
+                this.getBehindRenderPass(renderFrame).addMesh(mesh);
+            } else {
+                this.getEditorRenderPass(renderFrame).addMesh(mesh);
+            }
+        }
+    };
+    _proto.onDisable = function onDisable() {
+        RendererComponent1.prototype.onDisable.call(this);
+        if (!this.item.composition) {
+            return;
+        }
+        var renderFrame = this.item.composition.renderFrame;
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.meshes), _step; !(_step = _iterator()).done;){
+            var mesh = _step.value;
+            if (mesh.name === GeometryType.FloorGrid.toString() || mesh.name === "Box") {
+                this.getFrontRenderPass(renderFrame).removeMesh(mesh);
+            } else if (mesh.name === "translation" || mesh.name === "scale" || mesh.name === "rotation") {
+                this.getBehindRenderPass(renderFrame).removeMesh(mesh);
+            } else {
+                this.getEditorRenderPass(renderFrame).removeMesh(mesh);
+            }
+        }
+    };
     _proto.onUpdate = function onUpdate(dt) {
         this.updateRenderData();
     };
+    _proto.onDestroy = function onDestroy() {
+        var _this = this;
+        var gizmoMesh = this.mesh;
+        var composition = this.item.composition;
+        if (!composition) {
+            return;
+        }
+        if (gizmoMesh && !gizmoMesh.isDestroyed) {
+            gizmoMesh.dispose();
+            if (gizmoMesh.name === GeometryType.FloorGrid.toString() || gizmoMesh.name === "Box") {
+                this.getFrontRenderPass(composition.renderFrame).removeMesh(gizmoMesh);
+            } else {
+                this.getEditorRenderPass(composition.renderFrame).removeMesh(gizmoMesh);
+            }
+        }
+        if (this.contents) {
+            for(var _iterator = _create_for_of_iterator_helper_loose(this.contents), _step; !(_step = _iterator()).done;){
+                var _step_value = _step.value, mesh = _step_value[0];
+                if (!mesh.isDestroyed) {
+                    mesh.dispose();
+                    if (mesh.name === "translation" || mesh.name === "scale" || mesh.name === "rotation") {
+                        this.getBehindRenderPass(composition.renderFrame).removeMesh(mesh);
+                    } else {
+                        this.getEditorRenderPass(composition.renderFrame).removeMesh(mesh);
+                    }
+                }
+            }
+        }
+        if (this && this.wireframeMeshes.length > 0) {
+            this.wireframeMeshes.forEach(function(mesh) {
+                if (!mesh.isDestroyed) {
+                    destroyWireframeMesh(mesh);
+                    _this.getEditorRenderPass(composition.renderFrame).removeMesh(mesh);
+                }
+            });
+        } else {
+            var wireframeMesh = this.wireframeMesh;
+            if (wireframeMesh && !wireframeMesh.isDestroyed) {
+                destroyWireframeMesh(wireframeMesh);
+                this.getEditorRenderPass(composition.renderFrame).removeMesh(wireframeMesh);
+            }
+        }
+        var arr = composition.loaderData.gizmoItems;
+        var index = arr.indexOf(this.item);
+        if (index > -1) {
+            arr.splice(index, 1);
+        }
+    };
     _proto.render = function render(renderer) {
         // The material of the 3D plugin is updated during the render phase. In order to obtain the correct value, it is kept consistent here.
         if (this.subType === GizmoSubType.modelWireframe) {
@@ -3251,7 +3336,7 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
         }
         return result;
     };
-    _proto.createModelContent = function createModelContent(item, meshesToAdd) {
+    _proto.createModelContent = function createModelContent(item) {
         var _item_composition;
         var modelComponent = item.getComponent(RendererComponent);
         //@ts-expect-error TODO 和 3D 类型解耦
@@ -3268,10 +3353,10 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
             });
             var mesh = this.wireframeMesh = createModeWireframe(engine, originMesh, this.color);
             this.wireframeMeshes.push(mesh);
-            meshesToAdd.push(mesh);
+            this.meshes.push(mesh);
         }
     };
-    _proto.createParticleContent = function createParticleContent(item, meshesToAdd) {
+    _proto.createParticleContent = function createParticleContent(item) {
         var _this_item_composition;
         var shape = item.props.content.shape;
         var engine = (_this_item_composition = this.item.composition) == null ? void 0 : _this_item_composition.renderer.engine;
@@ -3281,14 +3366,13 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
             var mesh = this.mesh = createMeshFromShape(engine, shape, {
                 color: this.color
             });
-            meshesToAdd.push(mesh);
+            this.meshes.push(mesh);
         }
     };
     /**
    * 创建 BoundingBox 几何体模型
    * @param item - VFXItem
-   * @param meshesToAdd - 插件缓存的 Mesh 数组
-   */ _proto.createBoundingBoxContent = function createBoundingBoxContent(item, meshesToAdd) {
+   */ _proto.createBoundingBoxContent = function createBoundingBoxContent(item) {
         var _gizmoItem_composition;
         var gizmoItem = this.item;
         var shape = {
@@ -3306,15 +3390,14 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
                 color: this.color,
                 depthTest: this.depthTest
             });
-            meshesToAdd.push(mesh);
+            this.meshes.push(mesh);
         }
     };
     /**
    * 创建基础几何体模型
    * @param item - VFXItem
-   * @param meshesToAdd - 插件缓存的 Mesh 数组
    * @param subType - GizmoSubType 类型
-   */ _proto.createBasicContent = function createBasicContent(item, meshesToAdd, subType, iconTextures) {
+   */ _proto.createBasicContent = function createBasicContent(item, subType, iconTextures) {
         var _gizmoItem_composition;
         var gizmoItem = this.item;
         var options = {
@@ -3327,15 +3410,14 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
         assertExist(engine);
         var mesh = this.mesh = createMeshFromSubType(engine, subType, this.boundingMap, iconTextures, options);
         this.targetItem = item;
-        meshesToAdd.push(mesh);
+        this.meshes.push(mesh);
     };
     /**
    * 创建组合几何体模型
    * @param item - VFXItem
-   * @param meshesToAdd - 插件缓存的 Mesh 数组
    * @param subType - GizmoSubType 类型
    * @param iconTextures - XYZ 图标纹理（viewHelper 专用）
-   */ _proto.createCombinationContent = function createCombinationContent(item, meshesToAdd, subType, iconTextures) {
+   */ _proto.createCombinationContent = function createCombinationContent(item, subType, iconTextures) {
         var _gizmoItem_composition;
         var gizmoItem = this.item;
         var options = {
@@ -3347,7 +3429,7 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
         this.contents = createMeshFromSubType(engine, subType, this.boundingMap, iconTextures, options);
         for(var _iterator = _create_for_of_iterator_helper_loose(this.contents.keys()), _step; !(_step = _iterator()).done;){
             var mesh = _step.value;
-            meshesToAdd.push(mesh);
+            this.meshes.push(mesh);
         }
         this.targetItem = item;
     };
@@ -3375,6 +3457,36 @@ var GizmoComponent = /*#__PURE__*/ function(RendererComponent1) {
             item.transform = new Transform(data.transform);
         }
     };
+    _proto.getBehindRenderPass = function getBehindRenderPass(pipeline) {
+        var rp = pipeline.renderPasses.find(function(renderPass) {
+            return renderPass.name === behindRenderPassName;
+        });
+        if (!rp) {
+            rp = new DrawGizmoBehindPass(pipeline.renderer, {});
+            pipeline.addRenderPass(rp);
+        }
+        return rp;
+    };
+    _proto.getEditorRenderPass = function getEditorRenderPass(pipeline) {
+        var rp = pipeline.renderPasses.find(function(renderPass) {
+            return renderPass.name === editorRenderPassName;
+        });
+        if (!rp) {
+            rp = new DrawGizmoEditorPass(pipeline.renderer, {});
+            pipeline.addRenderPass(rp);
+        }
+        return rp;
+    };
+    _proto.getFrontRenderPass = function getFrontRenderPass(pipeline) {
+        var rp = pipeline.renderPasses.find(function(renderPass) {
+            return renderPass.name === frontRenderPassName;
+        });
+        if (!rp) {
+            rp = new DrawGizmoFrontPass(pipeline.renderer, {});
+            pipeline.addRenderPass(rp);
+        }
+        return rp;
+    };
     return GizmoComponent;
 }(RendererComponent);
 __decorate([
@@ -3388,10 +3500,55 @@ var CoordinateSpace;
     CoordinateSpace[CoordinateSpace["Local"] = 0] = "Local";
     CoordinateSpace[CoordinateSpace["World"] = 1] = "World";
 })(CoordinateSpace || (CoordinateSpace = {}));
+var DrawGizmoBehindPass = /*#__PURE__*/ function(RenderPass) {
+    _inherits(DrawGizmoBehindPass, RenderPass);
+    function DrawGizmoBehindPass(renderer, options) {
+        var _this;
+        _this = RenderPass.call(this, renderer, options) || this;
+        _this.priority = RenderPassPriorityPostprocess + RenderPassPriorityPostprocess;
+        _this.name = behindRenderPassName;
+        return _this;
+    }
+    var _proto = DrawGizmoBehindPass.prototype;
+    _proto.execute = function execute(renderer) {
+        renderer.clear({
+            depthAction: TextureLoadAction.clear
+        });
+        renderer.renderMeshes(this.meshes);
+    };
+    return DrawGizmoBehindPass;
+}(RenderPass);
+var DrawGizmoFrontPass = /*#__PURE__*/ function(RenderPass) {
+    _inherits(DrawGizmoFrontPass, RenderPass);
+    function DrawGizmoFrontPass(renderer, options) {
+        var _this;
+        _this = RenderPass.call(this, renderer, options) || this;
+        _this.priority = RenderPassPriorityPrepare + 2;
+        _this.name = frontRenderPassName;
+        return _this;
+    }
+    var _proto = DrawGizmoFrontPass.prototype;
+    _proto.execute = function execute(renderer) {
+        renderer.renderMeshes(this.meshes);
+    };
+    return DrawGizmoFrontPass;
+}(RenderPass);
+var DrawGizmoEditorPass = /*#__PURE__*/ function(RenderPass) {
+    _inherits(DrawGizmoEditorPass, RenderPass);
+    function DrawGizmoEditorPass(renderer, options) {
+        var _this;
+        _this = RenderPass.call(this, renderer, options) || this;
+        _this.priority = RenderPassPriorityPostprocess + 2;
+        _this.name = editorRenderPassName;
+        return _this;
+    }
+    var _proto = DrawGizmoEditorPass.prototype;
+    _proto.execute = function execute(renderer) {
+        renderer.renderMeshes(this.meshes);
+    };
+    return DrawGizmoEditorPass;
+}(RenderPass);
 
-var editorRenderPassName = "editor-gizmo";
-var frontRenderPassName = "front-gizmo";
-var behindRenderPassName = "behind-gizmo";
 var iconImages = new Map();
 var iconTextures = new Map();
 var EditorGizmoPlugin = /*#__PURE__*/ function(AbstractPlugin) {
@@ -3399,8 +3556,6 @@ var EditorGizmoPlugin = /*#__PURE__*/ function(AbstractPlugin) {
     function EditorGizmoPlugin() {
         var _this;
         _this = AbstractPlugin.apply(this, arguments) || this;
-        _this.meshToAdd = [];
-        _this.meshToRemove = [];
         _this.order = 1001;
         return _this;
     }
@@ -3429,182 +3584,6 @@ var EditorGizmoPlugin = /*#__PURE__*/ function(AbstractPlugin) {
         composition.loaderData.gizmoTarget = targetMap;
         composition.loaderData.gizmoItems = [];
     };
-    // override onCompositionItemLifeBegin (composition: Composition, item: VFXItem<any>) {
-    //   if (item.type === '7') {
-    //     return;
-    //   }
-    //   const gizmoVFXItemList: GizmoVFXItem[] = composition.loaderData.gizmoTarget[item.id];
-    //   if (gizmoVFXItemList && gizmoVFXItemList.length > 0) {
-    //     for (const gizmoVFXItem of gizmoVFXItemList) {
-    //       switch (gizmoVFXItem.subType) {
-    //         case GizmoSubType.particleEmitter:
-    //           gizmoVFXItem.createParticleContent(item, this.meshToAdd);
-    //           break;
-    //         case GizmoSubType.modelWireframe:
-    //           gizmoVFXItem.createModelContent(item, this.meshToAdd);
-    //           break;
-    //         case GizmoSubType.box:
-    //         case GizmoSubType.sphere:
-    //         case GizmoSubType.cylinder:
-    //         case GizmoSubType.cone:
-    //         case GizmoSubType.torus:
-    //         case GizmoSubType.sprite:
-    //         case GizmoSubType.frustum:
-    //         case GizmoSubType.directionLight:
-    //         case GizmoSubType.pointLight:
-    //         case GizmoSubType.spotLight:
-    //         case GizmoSubType.floorGrid:
-    //           gizmoVFXItem.createBasicContent(item, this.meshToAdd, gizmoVFXItem.subType);
-    //           break;
-    //         case GizmoSubType.camera:
-    //         case GizmoSubType.light:
-    //           gizmoVFXItem.createBasicContent(item, this.meshToAdd, gizmoVFXItem.subType, iconTextures);
-    //           break;
-    //         case GizmoSubType.rotation:
-    //         case GizmoSubType.scale:
-    //         case GizmoSubType.translation:
-    //           gizmoVFXItem.createCombinationContent(item, this.meshToAdd, gizmoVFXItem.subType);
-    //           break;
-    //         case GizmoSubType.viewHelper:
-    //           gizmoVFXItem.createCombinationContent(item, this.meshToAdd, gizmoVFXItem.subType, iconTextures);
-    //           break;
-    //         case GizmoSubType.boundingBox:
-    //           gizmoVFXItem.createBoundingBoxContent(item, this.meshToAdd);
-    //           break;
-    //         default:
-    //           break;
-    //       }
-    //     }
-    //   }
-    //   if (item.type === GizmoVFXItemType) {
-    //     composition.loaderData.gizmoItems.push(item);
-    //   }
-    // }
-    _proto.onCompositionItemRemoved = function onCompositionItemRemoved(composition, item) {
-        var _this = this;
-        if (item.type === GizmoVFXItemType) {
-            this.removeGizmoItem(composition, item);
-        } else {
-            var gizmoVFXItemList = composition.loaderData.gizmoTarget[item.id];
-            if (gizmoVFXItemList && gizmoVFXItemList.length > 0) {
-                gizmoVFXItemList.forEach(function(gizmoVFXItem) {
-                    _this.removeGizmoItem(composition, gizmoVFXItem);
-                });
-            }
-        }
-    };
-    _proto.removeGizmoItem = function removeGizmoItem(composition, gizmoVFXItem) {
-        var _this = this;
-        var gizmoMesh = gizmoVFXItem.getComponent(GizmoComponent).mesh;
-        if (gizmoMesh && !gizmoMesh.isDestroyed) {
-            gizmoMesh.dispose();
-            if (gizmoMesh.name === GeometryType.FloorGrid.toString() || gizmoMesh.name === "Box") {
-                this.getFrontRenderPass(composition.renderFrame).removeMesh(gizmoMesh);
-            } else {
-                this.getEditorRenderPass(composition.renderFrame).removeMesh(gizmoMesh);
-            }
-        }
-        if (gizmoVFXItem.getComponent(GizmoComponent).contents) {
-            for(var _iterator = _create_for_of_iterator_helper_loose(gizmoVFXItem.getComponent(GizmoComponent).contents), _step; !(_step = _iterator()).done;){
-                var _step_value = _step.value, mesh = _step_value[0];
-                if (!mesh.isDestroyed) {
-                    mesh.dispose();
-                    if (mesh.name === "translation" || mesh.name === "scale" || mesh.name === "rotation") {
-                        this.getBehindRenderPass(composition.renderFrame).removeMesh(mesh);
-                    } else {
-                        this.getEditorRenderPass(composition.renderFrame).removeMesh(mesh);
-                    }
-                }
-            }
-        }
-        var gizmoComponent = gizmoVFXItem.getComponent(GizmoComponent);
-        if (gizmoComponent && gizmoComponent.wireframeMeshes.length > 0) {
-            gizmoComponent.wireframeMeshes.forEach(function(mesh) {
-                if (!mesh.isDestroyed) {
-                    destroyWireframeMesh(mesh);
-                    _this.getEditorRenderPass(composition.renderFrame).removeMesh(mesh);
-                }
-            });
-        } else {
-            var wireframeMesh = gizmoVFXItem.getComponent(GizmoComponent).wireframeMesh;
-            if (wireframeMesh && !wireframeMesh.isDestroyed) {
-                destroyWireframeMesh(wireframeMesh);
-                this.getEditorRenderPass(composition.renderFrame).removeMesh(wireframeMesh);
-            }
-        }
-        var arr = composition.loaderData.gizmoItems;
-        var index = arr.indexOf(gizmoVFXItem);
-        if (index > -1) {
-            arr.splice(index, 1);
-        }
-    };
-    _proto.prepareRenderFrame = function prepareRenderFrame(composition, renderFrame) {
-        var _this = this;
-        this.meshToAdd.forEach(function(mesh) {
-            if (mesh.name === GeometryType.FloorGrid.toString() || mesh.name === "Box") {
-                _this.getFrontRenderPass(renderFrame).addMesh(mesh);
-            } else if (mesh.name === "translation" || mesh.name === "scale" || mesh.name === "rotation") {
-                _this.getBehindRenderPass(renderFrame).addMesh(mesh);
-            } else {
-                _this.getEditorRenderPass(renderFrame).addMesh(mesh);
-            }
-        });
-        this.meshToRemove.forEach(function(mesh) {
-            if (mesh.name === GeometryType.FloorGrid.toString() || mesh.name === "Box") {
-                _this.getFrontRenderPass(renderFrame).removeMesh(mesh);
-            } else if (mesh.name === "translation" || mesh.name === "scale" || mesh.name === "rotation") {
-                _this.getBehindRenderPass(renderFrame).removeMesh(mesh);
-            } else {
-                _this.getEditorRenderPass(renderFrame).removeMesh(mesh);
-            }
-            removeItem(_this.meshToAdd, mesh);
-        });
-        this.meshToRemove.length = 0;
-        // composition.loaderData.gizmoItems.forEach((item: GizmoVFXItem) => item.updateRenderData());
-        return false;
-    };
-    _proto.getBehindRenderPass = function getBehindRenderPass(pipeline) {
-        var rp = pipeline.renderPasses.find(function(renderPass) {
-            return renderPass.name === behindRenderPassName;
-        });
-        if (!rp) {
-            rp = new RenderPass(pipeline.renderer, {
-                name: behindRenderPassName,
-                priority: RenderPassPriorityPostprocess + RenderPassPriorityPostprocess,
-                clearAction: {
-                    depthAction: TextureLoadAction.clear
-                }
-            });
-            pipeline.addRenderPass(rp);
-        }
-        return rp;
-    };
-    _proto.getEditorRenderPass = function getEditorRenderPass(pipeline) {
-        var rp = pipeline.renderPasses.find(function(renderPass) {
-            return renderPass.name === editorRenderPassName;
-        });
-        if (!rp) {
-            rp = new RenderPass(pipeline.renderer, {
-                name: editorRenderPassName,
-                priority: RenderPassPriorityPostprocess + 2
-            });
-            pipeline.addRenderPass(rp);
-        }
-        return rp;
-    };
-    _proto.getFrontRenderPass = function getFrontRenderPass(pipeline) {
-        var rp = pipeline.renderPasses.find(function(renderPass) {
-            return renderPass.name === frontRenderPassName;
-        });
-        if (!rp) {
-            rp = new RenderPass(pipeline.renderer, {
-                name: frontRenderPassName,
-                priority: RenderPassPriorityPrepare + 2
-            });
-            pipeline.addRenderPass(rp);
-        }
-        return rp;
-    };
     EditorGizmoPlugin.prepareResource = function prepareResource(scene) {
         return _async_to_generator(function() {
             var _iterator, _step, _step_value, name, data, _, _tmp;
@@ -3656,7 +3635,7 @@ var EditorGizmoPlugin = /*#__PURE__*/ function(AbstractPlugin) {
 registerPlugin("editor-gizmo", EditorGizmoPlugin, VFXItem);
 /**
  * 插件版本号
- */ var version = "2.7.4";
+ */ var version = "2.8.0-alpha.1";
 logger.info("Plugin editor gizmo version: " + version + ".");
 if (version !== EFFECTS.version) {
     console.error("注意：请统一 Editor Gizmo 插件与 Player 版本，不统一的版本混用会有不可预知的后果！", "\nAttention: Please ensure the Editor Gizmo plugin is synchronized with the Player version. Mixing and matching incompatible versions may result in unpredictable consequences!");