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

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.0.0-alpha.1
+ * Version: v2.0.0-alpha.3
  */
 
 import * as THREE from 'three';
@@ -7340,275 +7340,6 @@ function generateSerializableMember(type, sourceName) {
     };
 }
 
-/**
- * @since 2.0.0
- * @internal
- */
-var EffectsObject = /** @class */ (function () {
-    function EffectsObject(engine) {
-        this.engine = engine;
-        this.guid = generateGUID();
-        this.taggedProperties = {};
-        this.engine.addInstance(this);
-    }
-    EffectsObject.prototype.getInstanceId = function () {
-        return this.guid;
-    };
-    EffectsObject.prototype.setInstanceId = function (guid) {
-        this.engine.removeInstance(this.guid);
-        this.guid = guid;
-        this.engine.addInstance(this);
-    };
-    EffectsObject.prototype.toData = function () { };
-    /**
-     * 反序列化函数
-     *
-     * @param data - 对象的序列化的数据
-     */
-    EffectsObject.prototype.fromData = function (data) {
-        if (data.id) {
-            this.setInstanceId(data.id);
-        }
-    };
-    EffectsObject.prototype.dispose = function () { };
-    __decorate([
-        serialize()
-    ], EffectsObject.prototype, "guid", void 0);
-    return EffectsObject;
-}());
-
-/**
- * @since 2.0.0
- * @internal
- */
-var Component = /** @class */ (function (_super) {
-    __extends(Component, _super);
-    function Component() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Object.defineProperty(Component.prototype, "transform", {
-        /**
-         * 附加到的 VFXItem 对象 Transform 组件
-         */
-        get: function () {
-            return this.item.transform;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Component.prototype.onAttached = function () { };
-    Component.prototype.onDestroy = function () { };
-    Component.prototype.fromData = function (data) {
-        _super.prototype.fromData.call(this, data);
-        if (data.item) {
-            this.item = data.item;
-        }
-    };
-    Component.prototype.dispose = function () {
-        this.onDestroy();
-        if (this.item) {
-            removeItem(this.item.components, this);
-        }
-    };
-    return Component;
-}(EffectsObject));
-/**
- * @since 2.0.0
- * @internal
- */
-var Behaviour = /** @class */ (function (_super) {
-    __extends(Behaviour, _super);
-    function Behaviour() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this._enabled = true;
-        return _this;
-    }
-    Object.defineProperty(Behaviour.prototype, "isActiveAndEnabled", {
-        /**
-         * 组件是否可以更新，true 更新，false 不更新
-         */
-        get: function () {
-            return this.item.getVisible() && this.enabled;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(Behaviour.prototype, "enabled", {
-        get: function () {
-            return this._enabled;
-        },
-        set: function (value) {
-            this._enabled = value;
-            if (value) {
-                this.onBehaviourEnable();
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Behaviour.prototype.onBehaviourEnable = function () { };
-    Behaviour.prototype.fromData = function (data) {
-        _super.prototype.fromData.call(this, data);
-    };
-    Behaviour.prototype.toData = function () {
-        _super.prototype.toData.call(this);
-    };
-    __decorate([
-        serialize()
-    ], Behaviour.prototype, "_enabled", void 0);
-    return Behaviour;
-}(Component));
-/**
- * @since 2.0.0
- * @internal
- */
-var ItemBehaviour = /** @class */ (function (_super) {
-    __extends(ItemBehaviour, _super);
-    function ItemBehaviour() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.started = false;
-        return _this;
-    }
-    // /**
-    //  * 生命周期函数，初始化后调用，生命周期内只调用一次
-    //  */
-    // awake () {
-    //   // OVERRIDE
-    // }
-    /**
-     * 在每次设置 enabled 为 true 时触发
-     */
-    ItemBehaviour.prototype.onEnable = function () { };
-    /**
-     * 生命周期函数，在第一次 update 前调用，生命周期内只调用一次
-     */
-    ItemBehaviour.prototype.start = function () {
-        // OVERRIDE
-    };
-    /**
-     * 生命周期函数，每帧调用一次
-     */
-    ItemBehaviour.prototype.update = function (dt) {
-        // OVERRIDE
-    };
-    /**
-     * 生命周期函数，每帧调用一次，在 update 之后调用
-     */
-    ItemBehaviour.prototype.lateUpdate = function (dt) {
-        // OVERRIDE
-    };
-    ItemBehaviour.prototype.onAttached = function () {
-        this.item.itemBehaviours.push(this);
-    };
-    ItemBehaviour.prototype.dispose = function () {
-        if (this.item) {
-            removeItem(this.item.itemBehaviours, this);
-        }
-        _super.prototype.dispose.call(this);
-    };
-    ItemBehaviour.prototype.onBehaviourEnable = function () {
-        this.onEnable();
-        if (!this.started) {
-            this.start();
-            this.started = true;
-        }
-    };
-    return ItemBehaviour;
-}(Behaviour));
-
-/**
- * 所有渲染组件的基类
- * @since 2.0.0
- */
-var RendererComponent = /** @class */ (function (_super) {
-    __extends(RendererComponent, _super);
-    function RendererComponent() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this.started = false;
-        _this.materials = [];
-        _this._enabled = true;
-        return _this;
-    }
-    Object.defineProperty(RendererComponent.prototype, "priority", {
-        get: function () {
-            return this._priority;
-        },
-        set: function (value) {
-            this._priority = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RendererComponent.prototype, "enabled", {
-        get: function () {
-            return this._enabled;
-        },
-        set: function (value) {
-            this._enabled = value;
-            if (value) {
-                this.onEnable();
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RendererComponent.prototype, "isActiveAndEnabled", {
-        /**
-         * 组件是否可以更新，true 更新，false 不更新
-         */
-        get: function () {
-            return this.item.getVisible() && this.enabled;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(RendererComponent.prototype, "material", {
-        get: function () {
-            return this.materials[0];
-        },
-        set: function (material) {
-            if (this.materials.length === 0) {
-                this.materials.push(material);
-            }
-            else {
-                this.materials[0] = material;
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    RendererComponent.prototype.onEnable = function () { };
-    RendererComponent.prototype.start = function () { };
-    RendererComponent.prototype.update = function (dt) { };
-    RendererComponent.prototype.lateUpdate = function (dt) { };
-    RendererComponent.prototype.render = function (renderer) { };
-    RendererComponent.prototype.onAttached = function () {
-        this.item.rendererComponents.push(this);
-    };
-    RendererComponent.prototype.fromData = function (data) {
-        _super.prototype.fromData.call(this, data);
-    };
-    RendererComponent.prototype.toData = function () {
-        _super.prototype.toData.call(this);
-    };
-    RendererComponent.prototype.dispose = function () {
-        if (this.item) {
-            removeItem(this.item.rendererComponents, this);
-        }
-        _super.prototype.dispose.call(this);
-    };
-    __decorate([
-        serialize()
-    ], RendererComponent.prototype, "materials", void 0);
-    __decorate([
-        serialize()
-    ], RendererComponent.prototype, "_priority", void 0);
-    __decorate([
-        serialize()
-    ], RendererComponent.prototype, "_enabled", void 0);
-    return RendererComponent;
-}(Component));
-
 var ShaderType;
 (function (ShaderType) {
     ShaderType[ShaderType["vertex"] = 0] = "vertex";
@@ -8195,6 +7926,43 @@ function loadMipmapImage(pointer, bins) {
     });
 }
 
+/**
+ * @since 2.0.0
+ * @internal
+ */
+var EffectsObject = /** @class */ (function () {
+    function EffectsObject(engine) {
+        this.engine = engine;
+        this.guid = generateGUID();
+        this.taggedProperties = {};
+        this.engine.addInstance(this);
+    }
+    EffectsObject.prototype.getInstanceId = function () {
+        return this.guid;
+    };
+    EffectsObject.prototype.setInstanceId = function (guid) {
+        this.engine.removeInstance(this.guid);
+        this.guid = guid;
+        this.engine.addInstance(this);
+    };
+    EffectsObject.prototype.toData = function () { };
+    /**
+     * 反序列化函数
+     *
+     * @param data - 对象的序列化的数据
+     */
+    EffectsObject.prototype.fromData = function (data) {
+        if (data.id) {
+            this.setInstanceId(data.id);
+        }
+    };
+    EffectsObject.prototype.dispose = function () { };
+    __decorate([
+        serialize()
+    ], EffectsObject.prototype, "guid", void 0);
+    return EffectsObject;
+}());
+
 var seed$a = 1;
 /**
  * Texture 抽象类
@@ -9005,54 +8773,286 @@ var SemanticMap = /** @class */ (function () {
     SemanticMap.prototype.hasSemanticValue = function (name) {
         return name in this.semantics;
     };
-    SemanticMap.prototype.dispose = function () {
-        var _this = this;
-        Object.keys(this.semantics).forEach(function (name) {
-            delete _this.semantics[name];
-        });
+    SemanticMap.prototype.dispose = function () {
+        var _this = this;
+        Object.keys(this.semantics).forEach(function (name) {
+            delete _this.semantics[name];
+        });
+    };
+    return SemanticMap;
+}());
+
+var _a$5;
+var BYTES_TYPE_MAP = (_a$5 = {},
+    _a$5[glContext.FLOAT] = Float32Array.BYTES_PER_ELEMENT,
+    _a$5[glContext.INT] = Int32Array.BYTES_PER_ELEMENT,
+    _a$5[glContext.SHORT] = Int16Array.BYTES_PER_ELEMENT,
+    _a$5[glContext.BYTE] = Int8Array.BYTES_PER_ELEMENT,
+    _a$5);
+/**
+ * Geometry 抽象类
+ */
+var Geometry = /** @class */ (function (_super) {
+    __extends(Geometry, _super);
+    function Geometry() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    /**
+     * 初始化 GPU 资源
+     * @override
+     */
+    Geometry.prototype.initialize = function () {
+        // OVERRIDE
+    };
+    /**
+     * 几何数据刷新
+     */
+    Geometry.prototype.flush = function () {
+        // OVERRIDE
+    };
+    return Geometry;
+}(EffectsObject));
+function generateEmptyTypedArray(type) {
+    if (type === glContext.INT) {
+        return new Int32Array(0);
+    }
+    if (type === glContext.SHORT) {
+        return new Int16Array(0);
+    }
+    return new Float32Array(0);
+}
+
+/**
+ * @since 2.0.0
+ * @internal
+ */
+var Component = /** @class */ (function (_super) {
+    __extends(Component, _super);
+    function Component() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Object.defineProperty(Component.prototype, "transform", {
+        /**
+         * 附加到的 VFXItem 对象 Transform 组件
+         */
+        get: function () {
+            return this.item.transform;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Component.prototype.onAttached = function () { };
+    Component.prototype.onDestroy = function () { };
+    Component.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+        if (data.item) {
+            this.item = data.item;
+        }
+    };
+    Component.prototype.dispose = function () {
+        this.onDestroy();
+        if (this.item) {
+            removeItem(this.item.components, this);
+        }
+    };
+    return Component;
+}(EffectsObject));
+/**
+ * @since 2.0.0
+ * @internal
+ */
+var Behaviour = /** @class */ (function (_super) {
+    __extends(Behaviour, _super);
+    function Behaviour() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this._enabled = true;
+        return _this;
+    }
+    Object.defineProperty(Behaviour.prototype, "isActiveAndEnabled", {
+        /**
+         * 组件是否可以更新，true 更新，false 不更新
+         */
+        get: function () {
+            return this.item.getVisible() && this.enabled;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(Behaviour.prototype, "enabled", {
+        get: function () {
+            return this._enabled;
+        },
+        set: function (value) {
+            this._enabled = value;
+            if (value) {
+                this.onBehaviourEnable();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Behaviour.prototype.onBehaviourEnable = function () { };
+    Behaviour.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+    };
+    Behaviour.prototype.toData = function () {
+        _super.prototype.toData.call(this);
     };
-    return SemanticMap;
-}());
-
-var _a$5;
-var BYTES_TYPE_MAP = (_a$5 = {},
-    _a$5[glContext.FLOAT] = Float32Array.BYTES_PER_ELEMENT,
-    _a$5[glContext.INT] = Int32Array.BYTES_PER_ELEMENT,
-    _a$5[glContext.SHORT] = Int16Array.BYTES_PER_ELEMENT,
-    _a$5[glContext.BYTE] = Int8Array.BYTES_PER_ELEMENT,
-    _a$5);
+    __decorate([
+        serialize()
+    ], Behaviour.prototype, "_enabled", void 0);
+    return Behaviour;
+}(Component));
 /**
- * Geometry 抽象类
+ * @since 2.0.0
+ * @internal
  */
-var Geometry = /** @class */ (function (_super) {
-    __extends(Geometry, _super);
-    function Geometry() {
-        return _super !== null && _super.apply(this, arguments) || this;
+var ItemBehaviour = /** @class */ (function (_super) {
+    __extends(ItemBehaviour, _super);
+    function ItemBehaviour() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.started = false;
+        return _this;
     }
+    // /**
+    //  * 生命周期函数，初始化后调用，生命周期内只调用一次
+    //  */
+    // awake () {
+    //   // OVERRIDE
+    // }
     /**
-     * 初始化 GPU 资源
-     * @override
+     * 在每次设置 enabled 为 true 时触发
      */
-    Geometry.prototype.initialize = function () {
+    ItemBehaviour.prototype.onEnable = function () { };
+    /**
+     * 生命周期函数，在第一次 update 前调用，生命周期内只调用一次
+     */
+    ItemBehaviour.prototype.start = function () {
         // OVERRIDE
     };
     /**
-     * 几何数据刷新
+     * 生命周期函数，每帧调用一次
      */
-    Geometry.prototype.flush = function () {
+    ItemBehaviour.prototype.update = function (dt) {
         // OVERRIDE
     };
-    return Geometry;
-}(EffectsObject));
-function generateEmptyTypedArray(type) {
-    if (type === glContext.INT) {
-        return new Int32Array(0);
-    }
-    if (type === glContext.SHORT) {
-        return new Int16Array(0);
+    /**
+     * 生命周期函数，每帧调用一次，在 update 之后调用
+     */
+    ItemBehaviour.prototype.lateUpdate = function (dt) {
+        // OVERRIDE
+    };
+    ItemBehaviour.prototype.onAttached = function () {
+        this.item.itemBehaviours.push(this);
+    };
+    ItemBehaviour.prototype.dispose = function () {
+        if (this.item) {
+            removeItem(this.item.itemBehaviours, this);
+        }
+        _super.prototype.dispose.call(this);
+    };
+    ItemBehaviour.prototype.onBehaviourEnable = function () {
+        this.onEnable();
+        if (!this.started) {
+            this.start();
+            this.started = true;
+        }
+    };
+    return ItemBehaviour;
+}(Behaviour));
+
+/**
+ * 所有渲染组件的基类
+ * @since 2.0.0
+ */
+var RendererComponent = /** @class */ (function (_super) {
+    __extends(RendererComponent, _super);
+    function RendererComponent() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.started = false;
+        _this.materials = [];
+        _this._enabled = true;
+        return _this;
     }
-    return new Float32Array(0);
-}
+    Object.defineProperty(RendererComponent.prototype, "priority", {
+        get: function () {
+            return this._priority;
+        },
+        set: function (value) {
+            this._priority = value;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(RendererComponent.prototype, "enabled", {
+        get: function () {
+            return this._enabled;
+        },
+        set: function (value) {
+            this._enabled = value;
+            if (value) {
+                this.onEnable();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(RendererComponent.prototype, "isActiveAndEnabled", {
+        /**
+         * 组件是否可以更新，true 更新，false 不更新
+         */
+        get: function () {
+            return this.item.getVisible() && this.enabled;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(RendererComponent.prototype, "material", {
+        get: function () {
+            return this.materials[0];
+        },
+        set: function (material) {
+            if (this.materials.length === 0) {
+                this.materials.push(material);
+            }
+            else {
+                this.materials[0] = material;
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    RendererComponent.prototype.onEnable = function () { };
+    RendererComponent.prototype.start = function () { };
+    RendererComponent.prototype.update = function (dt) { };
+    RendererComponent.prototype.lateUpdate = function (dt) { };
+    RendererComponent.prototype.render = function (renderer) { };
+    RendererComponent.prototype.onAttached = function () {
+        this.item.rendererComponents.push(this);
+    };
+    RendererComponent.prototype.fromData = function (data) {
+        _super.prototype.fromData.call(this, data);
+    };
+    RendererComponent.prototype.toData = function () {
+        _super.prototype.toData.call(this);
+    };
+    RendererComponent.prototype.dispose = function () {
+        if (this.item) {
+            removeItem(this.item.rendererComponents, this);
+        }
+        _super.prototype.dispose.call(this);
+    };
+    __decorate([
+        serialize()
+    ], RendererComponent.prototype, "materials", void 0);
+    __decorate([
+        serialize()
+    ], RendererComponent.prototype, "_priority", void 0);
+    __decorate([
+        serialize()
+    ], RendererComponent.prototype, "_enabled", void 0);
+    return RendererComponent;
+}(Component));
 
 var seed$8 = 1;
 /**
@@ -11289,7 +11289,7 @@ var SerializationHelper = /** @class */ (function () {
     };
     SerializationHelper.deserializeProperty = function (property, engine, level) {
         var e_11, _a, e_12, _b;
-        if (level > 10) {
+        if (level > 14) {
             console.error('序列化数据的内嵌对象层数大于上限');
             return;
         }
@@ -11350,7 +11350,7 @@ var SerializationHelper = /** @class */ (function () {
             return __generator(this, function (_j) {
                 switch (_j.label) {
                     case 0:
-                        if (level > 10) {
+                        if (level > 14) {
                             console.error('序列化数据的内嵌对象层数大于上限');
                             return [2 /*return*/];
                         }
@@ -11441,7 +11441,7 @@ var SerializationHelper = /** @class */ (function () {
     };
     SerializationHelper.serializeObjectProperty = function (objectProperty, serializedData, level) {
         var e_15, _a;
-        if (level > 10) {
+        if (level > 14) {
             console.error('序列化数据的内嵌对象层数大于上限');
             return;
         }
@@ -11486,7 +11486,7 @@ var SerializationHelper = /** @class */ (function () {
         }
     };
     SerializationHelper.serializeArrayProperty = function (arrayProperty, serializedData, level) {
-        if (level > 10) {
+        if (level > 14) {
             console.error('序列化数据的内嵌对象层数大于上限');
             return;
         }
@@ -11652,24 +11652,24 @@ var Database = /** @class */ (function () {
 }());
 var DataType;
 (function (DataType) {
-    DataType[DataType["VFXItemData"] = 0] = "VFXItemData";
-    DataType[DataType["EffectComponent"] = 1] = "EffectComponent";
-    DataType[DataType["Material"] = 2] = "Material";
-    DataType[DataType["Shader"] = 3] = "Shader";
-    DataType[DataType["SpriteComponent"] = 4] = "SpriteComponent";
-    DataType[DataType["ParticleSystem"] = 5] = "ParticleSystem";
-    DataType[DataType["InteractComponent"] = 6] = "InteractComponent";
-    DataType[DataType["CameraController"] = 7] = "CameraController";
-    DataType[DataType["Geometry"] = 8] = "Geometry";
-    DataType[DataType["Texture"] = 9] = "Texture";
-    DataType[DataType["TextComponent"] = 10] = "TextComponent";
+    DataType["VFXItemData"] = "VFXItemData";
+    DataType["EffectComponent"] = "EffectComponent";
+    DataType["Material"] = "Material";
+    DataType["Shader"] = "Shader";
+    DataType["SpriteComponent"] = "SpriteComponent";
+    DataType["ParticleSystem"] = "ParticleSystem";
+    DataType["InteractComponent"] = "InteractComponent";
+    DataType["CameraController"] = "CameraController";
+    DataType["Geometry"] = "Geometry";
+    DataType["Texture"] = "Texture";
+    DataType["TextComponent"] = "TextComponent";
     // FIXME: 先完成ECS的场景转换，后面移到spec中
-    DataType[DataType["MeshComponent"] = 10000] = "MeshComponent";
-    DataType[DataType["SkyboxComponent"] = 10001] = "SkyboxComponent";
-    DataType[DataType["LightComponent"] = 10002] = "LightComponent";
-    DataType[DataType["CameraComponent"] = 10003] = "CameraComponent";
-    DataType[DataType["ModelPluginComponent"] = 10004] = "ModelPluginComponent";
-    DataType[DataType["TreeComponent"] = 10005] = "TreeComponent";
+    DataType["MeshComponent"] = "MeshComponent";
+    DataType["SkyboxComponent"] = "SkyboxComponent";
+    DataType["LightComponent"] = "LightComponent";
+    DataType["CameraComponent"] = "CameraComponent";
+    DataType["ModelPluginComponent"] = "ModelPluginComponent";
+    DataType["TreeComponent"] = "TreeComponent";
 })(DataType || (DataType = {}));
 
 /**
@@ -13936,15 +13936,25 @@ var PlayableOutput = /** @class */ (function () {
     };
     return PlayableOutput;
 }());
+var PlayableAsset = /** @class */ (function () {
+    function PlayableAsset() {
+    }
+    PlayableAsset.prototype.fromData = function (data) {
+    };
+    return PlayableAsset;
+}());
 
 /**
  * @since 2.0.0
  * @internal
  */
-var Track = /** @class */ (function () {
+var Track = /** @class */ (function (_super) {
+    __extends(Track, _super);
     function Track() {
-        this.clips = [];
-        this.clipSeed = 0;
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.clips = [];
+        _this.clipSeed = 0;
+        return _this;
     }
     Track.prototype.createOutput = function () {
         var output = new PlayableOutput();
@@ -13956,7 +13966,7 @@ var Track = /** @class */ (function () {
     Track.prototype.createMixerPlayable = function () {
         return new Playable();
     };
-    Track.prototype.createPlayebleTree = function () {
+    Track.prototype.createPlayable = function () {
         var e_1, _a;
         var defaultMixPlayable = this.createMixerPlayable();
         try {
@@ -14008,7 +14018,7 @@ var Track = /** @class */ (function () {
         this.clips.push(clip);
     };
     return Track;
-}());
+}(PlayableAsset));
 /**
  * @since 2.0.0
  * @internal
@@ -14064,12 +14074,12 @@ var tempPos = new Vector3();
  * @since 2.0.0
  * @internal
  */
-var AnimationClipPlayable = /** @class */ (function (_super) {
-    __extends(AnimationClipPlayable, _super);
-    function AnimationClipPlayable() {
+var TransformAnimationPlayable = /** @class */ (function (_super) {
+    __extends(TransformAnimationPlayable, _super);
+    function TransformAnimationPlayable() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    AnimationClipPlayable.prototype.processFrame = function (dt) {
+    TransformAnimationPlayable.prototype.processFrame = function (dt) {
         if (this.bindingItem.composition) {
             this.sampleAnimation();
         }
@@ -14077,7 +14087,7 @@ var AnimationClipPlayable = /** @class */ (function (_super) {
     /**
      * 应用时间轴K帧数据到对象
      */
-    AnimationClipPlayable.prototype.sampleAnimation = function () {
+    TransformAnimationPlayable.prototype.sampleAnimation = function () {
         var _this = this;
         var duration = this.bindingItem.duration;
         var life = this.time / duration;
@@ -14122,7 +14132,7 @@ var AnimationClipPlayable = /** @class */ (function (_super) {
             // this.animationStream.setCurveValue('transform', 'position.z', pos.z);
         }
     };
-    AnimationClipPlayable.prototype.fromData = function (data) {
+    TransformAnimationPlayable.prototype.fromData = function (data) {
         var _a;
         var scale = this.bindingItem.transform.scale;
         this.originalTransform = {
@@ -14193,30 +14203,45 @@ var AnimationClipPlayable = /** @class */ (function (_super) {
         this.velocity = this.direction.clone();
         this.velocity.multiply(this.startSpeed);
     };
-    return AnimationClipPlayable;
+    return TransformAnimationPlayable;
 }(AnimationPlayable));
+var TransformAnimationPlayableAsset = /** @class */ (function (_super) {
+    __extends(TransformAnimationPlayableAsset, _super);
+    function TransformAnimationPlayableAsset() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    TransformAnimationPlayableAsset.prototype.createPlayable = function () {
+        var transformAnimationPlayable = new TransformAnimationPlayable();
+        transformAnimationPlayable.fromData(this.transformAnimationData);
+        return transformAnimationPlayable;
+    };
+    TransformAnimationPlayableAsset.prototype.fromData = function (data) {
+        this.transformAnimationData = data;
+    };
+    return TransformAnimationPlayableAsset;
+}(PlayableAsset));
 /**
  * @since 2.0.0
  * @internal
  */
-var ActivationClipPlayable = /** @class */ (function (_super) {
-    __extends(ActivationClipPlayable, _super);
-    function ActivationClipPlayable() {
+var ActivationPlayable = /** @class */ (function (_super) {
+    __extends(ActivationPlayable, _super);
+    function ActivationPlayable() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    ActivationClipPlayable.prototype.onGraphStart = function () {
+    ActivationPlayable.prototype.onGraphStart = function () {
         this.bindingItem.transform.setValid(false);
         this.hideRendererComponents();
     };
-    ActivationClipPlayable.prototype.onPlayablePlay = function () {
+    ActivationPlayable.prototype.onPlayablePlay = function () {
         this.bindingItem.transform.setValid(true);
         this.showRendererComponents();
     };
-    ActivationClipPlayable.prototype.onPlayableDestroy = function () {
+    ActivationPlayable.prototype.onPlayableDestroy = function () {
         this.bindingItem.transform.setValid(false);
         this.hideRendererComponents();
     };
-    ActivationClipPlayable.prototype.hideRendererComponents = function () {
+    ActivationPlayable.prototype.hideRendererComponents = function () {
         var e_1, _a;
         try {
             for (var _b = __values$1(this.bindingItem.rendererComponents), _c = _b.next(); !_c.done; _c = _b.next()) {
@@ -14234,7 +14259,7 @@ var ActivationClipPlayable = /** @class */ (function (_super) {
             finally { if (e_1) throw e_1.error; }
         }
     };
-    ActivationClipPlayable.prototype.showRendererComponents = function () {
+    ActivationPlayable.prototype.showRendererComponents = function () {
         var e_2, _a;
         try {
             for (var _b = __values$1(this.bindingItem.rendererComponents), _c = _b.next(); !_c.done; _c = _b.next()) {
@@ -14252,7 +14277,7 @@ var ActivationClipPlayable = /** @class */ (function (_super) {
             finally { if (e_2) throw e_2.error; }
         }
     };
-    return ActivationClipPlayable;
+    return ActivationPlayable;
 }(Playable));
 
 /**
@@ -14507,7 +14532,7 @@ var TimelineComponent = /** @class */ (function (_super) {
         try {
             for (var _b = __values$1(this.tracks), _c = _b.next(); !_c.done; _c = _b.next()) {
                 var track = _c.value;
-                var trackMixPlayable = track.createPlayebleTree();
+                var trackMixPlayable = track.createPlayable();
                 var trackOutput = track.createOutput();
                 graph.addOutput(trackOutput);
                 trackOutput.setSourcePlayeble(trackMixPlayable);
@@ -14522,6 +14547,7 @@ var TimelineComponent = /** @class */ (function (_super) {
         }
     };
     TimelineComponent.prototype.fromData = function (data) {
+        var e_13, _a, e_14, _b;
         _super.prototype.fromData.call(this, data);
         this.options = {
             start: this.item.start,
@@ -14532,7 +14558,47 @@ var TimelineComponent = /** @class */ (function (_super) {
         this.id = this.item.id;
         this.name = this.item.name;
         var activationTrack = this.createTrack(Track, 'ActivationTrack');
-        activationTrack.createClip(ActivationClipPlayable, 'ActivationTimelineClip');
+        activationTrack.createClip(ActivationPlayable, 'ActivationTimelineClip');
+        //@ts-expect-error
+        if (data.tracks) {
+            //@ts-expect-error
+            var tracks = data.tracks;
+            try {
+                for (var tracks_1 = __values$1(tracks), tracks_1_1 = tracks_1.next(); !tracks_1_1.done; tracks_1_1 = tracks_1.next()) {
+                    var track = tracks_1_1.value;
+                    var newTrack = this.createTrack(Track);
+                    try {
+                        for (var _c = (e_14 = void 0, __values$1(track.clips)), _d = _c.next(); !_d.done; _d = _c.next()) {
+                            var clipAsset = _d.value;
+                            switch (clipAsset.dataType) {
+                                case 'TransformAnimationPlayableAsset':
+                                    newTrack.name = 'AnimationTrack';
+                                    newTrack.createClip(TransformAnimationPlayable, 'AnimationTimelineClip').playable.fromData(clipAsset.animationClip);
+                                    break;
+                                case 'SpriteColorAnimationPlayableAsset':
+                                    newTrack.name = 'SpriteColorTrack';
+                                    newTrack.createClip(SpriteColorPlayable, 'SpriteColorClip').playable.fromData(clipAsset.animationClip);
+                                    break;
+                            }
+                        }
+                    }
+                    catch (e_14_1) { e_14 = { error: e_14_1 }; }
+                    finally {
+                        try {
+                            if (_d && !_d.done && (_b = _c.return)) _b.call(_c);
+                        }
+                        finally { if (e_14) throw e_14.error; }
+                    }
+                }
+            }
+            catch (e_13_1) { e_13 = { error: e_13_1 }; }
+            finally {
+                try {
+                    if (tracks_1_1 && !tracks_1_1.done && (_a = tracks_1.return)) _a.call(tracks_1);
+                }
+                finally { if (e_13) throw e_13.error; }
+            }
+        }
     };
     TimelineComponent.prototype.toData = function () {
         _super.prototype.toData.call(this);
@@ -14946,9 +15012,6 @@ var SpriteComponent = /** @class */ (function (_super) {
         this.material.setVector4('_Color', new Vector4().setFromArray(startColor));
         this.material.setVector4('_TexOffset', new Vector4().setFromArray([0, 0, 1, 1]));
         this.setItem();
-        // 添加K帧动画
-        var colorTrack = this.item.getComponent(TimelineComponent).createTrack(Track, 'SpriteColorTrack');
-        colorTrack.createClip(SpriteColorPlayable, 'SpriteColorClip').playable.fromData({ colorOverLifetime: data.colorOverLifetime, startColor: data.options.startColor });
     };
     SpriteComponent.prototype.toData = function () {
         _super.prototype.toData.call(this);
@@ -20605,10 +20668,6 @@ var VFXItem = /** @class */ (function (_super) {
         }
         var timelineComponent = this.getComponent(TimelineComponent);
         timelineComponent.fromData(data.content);
-        if (this.type !== ItemType$1.particle) {
-            var track = timelineComponent.createTrack(Track, 'AnimationTrack');
-            track.createClip(AnimationClipPlayable, 'AnimationTimelineClip').playable.fromData(data.content);
-        }
         if (duration <= 0) {
             throw Error("Item duration can't be less than 0, see ".concat(HELP_LINK['Item duration can\'t be less than 0']));
         }
@@ -22820,6 +22879,49 @@ function version3Migration(scene) {
             if (item.endBehavior === END_BEHAVIOR_PAUSE_AND_DESTROY$1 || item.endBehavior === END_BEHAVIOR_PAUSE$1) {
                 item.endBehavior = END_BEHAVIOR_FREEZE$1;
             }
+            // 动画数据转化 TODO: 动画数据移到 TimelineComponentData
+            //@ts-expect-error
+            item.content.tracks = [];
+            //@ts-expect-error
+            var tracks = item.content.tracks;
+            if (item.type !== ItemType$1.particle) {
+                tracks.push({
+                    clips: [
+                        {
+                            dataType: 'TransformAnimationPlayableAsset',
+                            animationClip: {
+                                //@ts-expect-error
+                                sizeOverLifetime: item.content.sizeOverLifetime,
+                                //@ts-expect-error
+                                rotationOverLifetime: item.content.rotationOverLifetime,
+                                //@ts-expect-error
+                                positionOverLifetime: item.content.positionOverLifetime,
+                            },
+                        },
+                    ],
+                });
+            }
+            if (item.type === ItemType$1.sprite) {
+                tracks.push({
+                    clips: [
+                        {
+                            dataType: 'SpriteColorAnimationPlayableAsset',
+                            animationClip: {
+                                //@ts-expect-error
+                                colorOverLifetime: item.content.colorOverLifetime,
+                                //@ts-expect-error
+                                startColor: item.content.options.startColor,
+                            },
+                        },
+                    ],
+                });
+            }
+            // gizmo 的 target id 转换为新的 item guid
+            //@ts-expect-error
+            if (item.content.options.target) {
+                //@ts-expect-error
+                item.content.options.target = itemGuidMap[item.content.options.target];
+            }
             // item 的 content 转为 component data 加入 JSONScene.components
             var uuid = v4().replace(/-/g, '');
             if (item.type === ItemType$1.sprite) {
@@ -27518,8 +27620,8 @@ Geometry.create = function (engine, options) {
 Mesh.create = function (engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.0.0-alpha.1";
+var version = "2.0.0-alpha.3";
 logger.info('THREEJS plugin version: ' + version);
 
-export { AbstractPlugin, ActivationClipPlayable, AnimationClipPlayable, AssetLoader, AssetManager, BYTES_TYPE_MAP, Behaviour, BezierSegments, 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, Component, Composition, CompositionComponent, CompositionSourceManager, CurveValue, DEFAULT_FONTS, DataType, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, Engine, EventSystem, FILTER_NAME_NONE, FilterMode, Float16ArrayWrapper, FrameBuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractBehavior$1 as InteractBehavior, InteractComponent, InteractLoader, InteractMesh, Item, ItemBehaviour, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, Mesh, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, PassTextureCache, PathSegments, PluginSystem, QCanvasViewer, QText, QTextWrapMode, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderBuffer, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderer, RendererComponent, 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, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderType, SpriteColorPlayable, SpriteComponent, SpriteLoader, StaticValue, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextComponent, TextLoader, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeEngine, ThreeMaterial, ThreeSpriteComponent, ThreeTexture, Ticker, TimelineClip, TimelineComponent, Track, Transform, VFXItem, ValueGetter, addByOrder, addItem, addItemWithOrder, alphaFrame_frag as alphaFrameFrag, alphaMask_frag as alphaMaskFrag, assertExist, asserts, blend, bloomMix_frag as bloomMixVert, bloomThreshold_frag as bloomThresholdVert, calculateTranslation, cameraMove_frag as cameraMoveFrag, cameraMove_vert as cameraMoveVert, canvasPool, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, combineImageTemplate1, combineImageTemplate1Async, combineImageTemplate2, combineImageTemplate2Async, combineImageTemplateAsync, compatible_frag as compatibleFrag, compatible_vert as compatibleVert, copy as copyFrag, createCopyShader, createGLContext, createKeyFrameMeta, createShaderWithMarcos, createShape, createVFXItem, createValueGetter, deepClone, defaultGlobalVolume, defaultPlugins, delay_frag as delayFrag, deserializeMipmapTexture, distortion_frag as distortionFrag, distortion_vert as distortionVert, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTemplateCanvasPool, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAndroid, isArray, isFunction, isIOS, isObject, isScene, isSceneWithOptions, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isWebGL2, item_define as itemDefine, itemFrag, itemFrameFrag, itemVert, loadBinary, loadBlob, loadImage, loadVideo, loadWebPOptional, logger, index$1 as math, maxSpriteMeshItemCount, maxSpriteTextureCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap, particleVert, pluginLoaderMap, random, registerPlugin, removeItem, requestAsync, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxFragmentTextures, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecAssign, vecFill, vecMulCombine, vecNormalize, version };
+export { AbstractPlugin, ActivationPlayable, AssetLoader, AssetManager, BYTES_TYPE_MAP, Behaviour, BezierSegments, 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, Component, Composition, CompositionComponent, CompositionSourceManager, CurveValue, DEFAULT_FONTS, DataType, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, Engine, EventSystem, FILTER_NAME_NONE, FilterMode, Float16ArrayWrapper, FrameBuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractBehavior$1 as InteractBehavior, InteractComponent, InteractLoader, InteractMesh, Item, ItemBehaviour, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, Mesh, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, PassTextureCache, PathSegments, PluginSystem, QCanvasViewer, QText, QTextWrapMode, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderBuffer, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderer, RendererComponent, 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, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderType, SpriteColorPlayable, SpriteComponent, SpriteLoader, StaticValue, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextComponent, TextLoader, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeEngine, ThreeMaterial, ThreeSpriteComponent, ThreeTexture, Ticker, TimelineClip, TimelineComponent, Track, Transform, TransformAnimationPlayable, TransformAnimationPlayableAsset, VFXItem, ValueGetter, addByOrder, addItem, addItemWithOrder, alphaFrame_frag as alphaFrameFrag, alphaMask_frag as alphaMaskFrag, assertExist, asserts, blend, bloomMix_frag as bloomMixVert, bloomThreshold_frag as bloomThresholdVert, calculateTranslation, cameraMove_frag as cameraMoveFrag, cameraMove_vert as cameraMoveVert, canvasPool, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, combineImageTemplate1, combineImageTemplate1Async, combineImageTemplate2, combineImageTemplate2Async, combineImageTemplateAsync, compatible_frag as compatibleFrag, compatible_vert as compatibleVert, copy as copyFrag, createCopyShader, createGLContext, createKeyFrameMeta, createShaderWithMarcos, createShape, createVFXItem, createValueGetter, deepClone, defaultGlobalVolume, defaultPlugins, delay_frag as delayFrag, deserializeMipmapTexture, distortion_frag as distortionFrag, distortion_vert as distortionVert, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTemplateCanvasPool, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAndroid, isArray, isFunction, isIOS, isObject, isScene, isSceneWithOptions, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isWebGL2, item_define as itemDefine, itemFrag, itemFrameFrag, itemVert, loadBinary, loadBlob, loadImage, loadVideo, loadWebPOptional, logger, index$1 as math, maxSpriteMeshItemCount, maxSpriteTextureCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap, particleVert, pluginLoaderMap, random, registerPlugin, removeItem, requestAsync, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxFragmentTextures, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecAssign, vecFill, vecMulCombine, vecNormalize, version };
 //# sourceMappingURL=index.mjs.map