@galacean/effects-threejs 2.0.0-alpha.13 → 2.0.0-alpha.15

package/dist/index.js

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.0.0-alpha.13
+ * Version: v2.0.0-alpha.15
  */
 
 'use strict';
@@ -765,6 +765,11 @@ function noop() {}
  */ function isObject(obj) {
     return Object.prototype.toString.call(obj) === "[object Object]";
 }
+function isCanvas(canvas) {
+    var _canvas_tagName;
+    // 小程序 Canvas 无法使用 instanceof HTMLCanvasElement 判断
+    return typeof canvas === "object" && canvas !== null && ((_canvas_tagName = canvas.tagName) == null ? void 0 : _canvas_tagName.toUpperCase()) === "CANVAS";
+}
 function deepClone(obj) {
     if (isArray(obj)) {
         return obj.map(deepClone);
@@ -792,6 +797,37 @@ function throwDestroyedError() {
 function generateGUID() {
     return v4().replace(/-/g, "");
 }
+function base64ToFile(base64, filename, contentType) {
+    if (filename === void 0) filename = "base64File";
+    if (contentType === void 0) contentType = "";
+    // 去掉 Base64 字符串的 Data URL 部分（如果存在）
+    var base64WithoutPrefix = base64.split(",")[1] || base64;
+    // 将 base64 编码的字符串转换为二进制字符串
+    var byteCharacters = atob(base64WithoutPrefix);
+    // 创建一个 8 位无符号整数值的数组，即“字节数组”
+    var byteArrays = [];
+    // 切割二进制字符串为多个片段，并将每个片段转换成一个字节数组
+    for(var offset = 0; offset < byteCharacters.length; offset += 512){
+        var slice = byteCharacters.slice(offset, offset + 512);
+        var byteNumbers = new Array(slice.length);
+        for(var i = 0; i < slice.length; i++){
+            byteNumbers[i] = slice.charCodeAt(i);
+        }
+        var byteArray = new Uint8Array(byteNumbers);
+        byteArrays.push(byteArray);
+    }
+    // 使用字节数组创建 Blob 对象
+    var blob = new Blob(byteArrays, {
+        type: contentType
+    });
+    // 创建 File 对象
+    var file = new File([
+        blob
+    ], filename, {
+        type: contentType
+    });
+    return file;
+}
 
 function _defineProperties(target, props) {
     for(var i = 0; i < props.length; i++){
@@ -18520,7 +18556,7 @@ exports.TransformPlayableAsset = __decorate([
     _proto.processFrame = function processFrame(context) {};
     return ActivationPlayable;
 }(Playable);
-var ActivationPlayableAsset = /*#__PURE__*/ function(PlayableAsset) {
+exports.ActivationPlayableAsset = /*#__PURE__*/ function(PlayableAsset) {
     _inherits(ActivationPlayableAsset, PlayableAsset);
     function ActivationPlayableAsset() {
         return PlayableAsset.apply(this, arguments);
@@ -18531,6 +18567,9 @@ var ActivationPlayableAsset = /*#__PURE__*/ function(PlayableAsset) {
     };
     return ActivationPlayableAsset;
 }(PlayableAsset);
+exports.ActivationPlayableAsset = __decorate([
+    effectsClass("ActivationPlayableAsset")
+], exports.ActivationPlayableAsset);
 exports.AnimationClip = /*#__PURE__*/ function(EffectsObject) {
     _inherits(AnimationClip, EffectsObject);
     function AnimationClip() {
@@ -18660,17 +18699,15 @@ exports.TrackAsset = /*#__PURE__*/ function(PlayableAsset) {
         return _this;
     }
     var _proto = TrackAsset.prototype;
-    _proto.initializeBinding = function initializeBinding(parentBinding) {
-        this.binding = parentBinding;
+    /**
+   * 重写该方法以获取自定义对象绑定
+   */ _proto.resolveBinding = function resolveBinding(parentBinding) {
+        return parentBinding;
     };
     /**
-   * @internal
-   */ _proto.initializeBindingRecursive = function initializeBindingRecursive(parentBinding) {
-        this.initializeBinding(parentBinding);
-        for(var _iterator = _create_for_of_iterator_helper_loose(this.children), _step; !(_step = _iterator()).done;){
-            var subTrack = _step.value;
-            subTrack.initializeBindingRecursive(this.binding);
-        }
+   * 重写该方法以创建自定义混合器
+   */ _proto.createTrackMixer = function createTrackMixer(graph) {
+        return new Playable(graph);
     };
     _proto.createOutput = function createOutput() {
         var output = new PlayableOutput();
@@ -18701,17 +18738,15 @@ exports.TrackAsset = /*#__PURE__*/ function(PlayableAsset) {
         }
         return mixer;
     };
-    /**
-   * 重写该方法以创建自定义混合器
-   */ _proto.createTrackMixer = function createTrackMixer(graph) {
-        return new Playable(graph);
-    };
     _proto.createPlayable = function createPlayable(graph) {
         return new Playable(graph);
     };
     _proto.getChildTracks = function getChildTracks() {
         return this.children;
     };
+    _proto.addChild = function addChild(child) {
+        this.children.push(child);
+    };
     _proto.createClip = function createClip(classConstructor, name) {
         var newClip = new exports.TimelineClip();
         newClip.asset = new classConstructor(this.engine);
@@ -18789,9 +18824,10 @@ var RuntimeClip = /*#__PURE__*/ function() {
         var weight = 1.0;
         var ended = false;
         var started = false;
+        var boundItem = this.track.binding;
         if (localTime > clip.start + clip.duration + 0.001 && clip.endBehaviour === ItemEndBehavior.destroy) {
-            var _this_track_binding_getComponent;
-            if (exports.VFXItem.isParticle(this.track.binding) && !((_this_track_binding_getComponent = this.track.binding.getComponent(exports.ParticleSystem)) == null ? void 0 : _this_track_binding_getComponent.destroyed)) {
+            var _boundItem_getComponent;
+            if (exports.VFXItem.isParticle(boundItem) && !((_boundItem_getComponent = boundItem.getComponent(exports.ParticleSystem)) == null ? void 0 : _boundItem_getComponent.destroyed)) {
                 weight = 1.0;
             } else {
                 weight = 0.0;
@@ -18807,7 +18843,6 @@ var RuntimeClip = /*#__PURE__*/ function() {
             this.playable.play();
         }
         this.parentMixer.setInputWeight(this.playable, weight);
-        var boundItem = this.track.binding;
         // 判断动画是否结束
         if (ended && !boundItem.ended) {
             boundItem.ended = true;
@@ -18844,6 +18879,45 @@ var RuntimeClip = /*#__PURE__*/ function() {
     return RuntimeClip;
 }();
 
+exports.ObjectBindingTrack = /*#__PURE__*/ function(TrackAsset1) {
+    _inherits(ObjectBindingTrack, TrackAsset1);
+    function ObjectBindingTrack() {
+        return TrackAsset1.apply(this, arguments);
+    }
+    var _proto = ObjectBindingTrack.prototype;
+    _proto.create = function create(timelineAsset) {
+        var boundItem = this.binding;
+        // 添加粒子动画 clip
+        if (boundItem.getComponent(exports.ParticleSystem)) {
+            var particleTrack = timelineAsset.createTrack(exports.TrackAsset, this, "ParticleTrack");
+            particleTrack.binding = this.binding;
+            var particleClip = particleTrack.createClip(ParticleBehaviourPlayableAsset);
+            particleClip.start = boundItem.start;
+            particleClip.duration = boundItem.duration;
+            particleClip.endBehaviour = boundItem.endBehavior;
+        }
+    };
+    _proto.fromData = function fromData(data) {
+        TrackAsset1.prototype.fromData.call(this, data);
+        this.data = data;
+    };
+    return ObjectBindingTrack;
+}(exports.TrackAsset);
+exports.ObjectBindingTrack = __decorate([
+    effectsClass("ObjectBindingTrack")
+], exports.ObjectBindingTrack);
+
+exports.TransformTrack = /*#__PURE__*/ function(TrackAsset) {
+    _inherits(TransformTrack, TrackAsset);
+    function TransformTrack() {
+        return TrackAsset.apply(this, arguments);
+    }
+    return TransformTrack;
+}(exports.TrackAsset);
+exports.TransformTrack = __decorate([
+    effectsClass("TransformTrack")
+], exports.TransformTrack);
+
 var ActivationMixerPlayable = /*#__PURE__*/ function(Playable) {
     _inherits(ActivationMixerPlayable, Playable);
     function ActivationMixerPlayable() {
@@ -18907,85 +18981,6 @@ exports.ActivationTrack = __decorate([
     effectsClass("ActivationTrack")
 ], exports.ActivationTrack);
 
-exports.ObjectBindingTrack = /*#__PURE__*/ function(TrackAsset1) {
-    _inherits(ObjectBindingTrack, TrackAsset1);
-    function ObjectBindingTrack() {
-        var _this;
-        _this = TrackAsset1.apply(this, arguments) || this;
-        _this.trackSeed = 0;
-        return _this;
-    }
-    var _proto = ObjectBindingTrack.prototype;
-    _proto.create = function create() {
-        this.options = {
-            start: this.binding.start,
-            duration: this.binding.duration,
-            looping: this.binding.endBehavior === ItemEndBehavior.loop,
-            endBehavior: this.binding.endBehavior || ItemEndBehavior.destroy
-        };
-        this.id = this.binding.id;
-        this.name = this.binding.name;
-        var activationTrack = this.createTrack(exports.ActivationTrack, "ActivationTrack");
-        activationTrack.binding = this.binding;
-        activationTrack.createClip(ActivationPlayableAsset, "ActivationTimelineClip");
-        // 添加粒子动画 clip
-        if (this.binding.getComponent(exports.ParticleSystem)) {
-            var particleTrack = this.createTrack(exports.TrackAsset, "ParticleTrack");
-            particleTrack.binding = this.binding;
-            particleTrack.createClip(ParticleBehaviourPlayableAsset);
-        }
-        // TODO TimelineClip 需要传入 start 和 duration 数据
-        for(var _iterator = _create_for_of_iterator_helper_loose(this.children), _step; !(_step = _iterator()).done;){
-            var track = _step.value;
-            for(var _iterator1 = _create_for_of_iterator_helper_loose(track.getClips()), _step1; !(_step1 = _iterator1()).done;){
-                var clip = _step1.value;
-                clip.start = this.binding.start;
-                clip.duration = this.binding.duration;
-                clip.endBehaviour = this.binding.endBehavior;
-            }
-        }
-    };
-    _proto.toLocalTime = function toLocalTime(time) {
-        var localTime = time - this.options.start;
-        var duration = this.options.duration;
-        if (localTime - duration > 0.001) {
-            if (this.options.endBehavior === END_BEHAVIOR_RESTART) {
-                localTime = localTime % duration;
-            } else if (this.options.endBehavior === END_BEHAVIOR_FREEZE) {
-                localTime = Math.min(duration, localTime);
-            }
-        }
-        return localTime;
-    };
-    _proto.createTrack = function createTrack(classConstructor, name) {
-        var newTrack = new classConstructor(this.engine);
-        newTrack.binding = this.binding;
-        newTrack.id = (this.trackSeed++).toString();
-        newTrack.name = name ? name : "Track" + newTrack.id;
-        this.children.push(newTrack);
-        return newTrack;
-    };
-    _proto.fromData = function fromData(data) {
-        TrackAsset1.prototype.fromData.call(this, data);
-        this.data = data;
-    };
-    return ObjectBindingTrack;
-}(exports.TrackAsset);
-exports.ObjectBindingTrack = __decorate([
-    effectsClass("ObjectBindingTrack")
-], exports.ObjectBindingTrack);
-
-exports.TransformTrack = /*#__PURE__*/ function(TrackAsset) {
-    _inherits(TransformTrack, TrackAsset);
-    function TransformTrack() {
-        return TrackAsset.apply(this, arguments);
-    }
-    return TransformTrack;
-}(exports.TrackAsset);
-exports.TransformTrack = __decorate([
-    effectsClass("TransformTrack")
-], exports.TransformTrack);
-
 exports.SpriteColorTrack = /*#__PURE__*/ function(TrackAsset) {
     _inherits(SpriteColorTrack, TrackAsset);
     function SpriteColorTrack() {
@@ -19007,17 +19002,29 @@ exports.TimelineAsset = /*#__PURE__*/ function(PlayableAsset) {
     }
     var _proto = TimelineAsset.prototype;
     _proto.createPlayable = function createPlayable(graph) {
-        this.graph = graph;
         var timelinePlayable = new TimelinePlayable(graph);
         timelinePlayable.setTraversalMode(PlayableTraversalMode.Passthrough);
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.tracks), _step; !(_step = _iterator()).done;){
+            var track = _step.value;
+            if (_instanceof1(track, exports.ObjectBindingTrack)) {
+                track.create(this);
+            }
+        }
         timelinePlayable.compileTracks(graph, this.tracks);
         return timelinePlayable;
     };
-    _proto.fromData = function fromData(data) {
-        this.tracks = data.tracks;
+    _proto.createTrack = function createTrack(classConstructor, parent, name) {
+        var newTrack = new classConstructor(this.engine);
+        newTrack.name = name ? name : classConstructor.name;
+        parent.addChild(newTrack);
+        return newTrack;
     };
+    _proto.fromData = function fromData(data) {};
     return TimelineAsset;
 }(PlayableAsset);
+__decorate([
+    serialize()
+], exports.TimelineAsset.prototype, "tracks", void 0);
 exports.TimelineAsset = __decorate([
     effectsClass("TimelineAsset")
 ], exports.TimelineAsset);
@@ -19027,7 +19034,6 @@ var TimelinePlayable = /*#__PURE__*/ function(Playable) {
         var _this;
         _this = Playable.apply(this, arguments) || this;
         _this.clips = [];
-        _this.masterTracks = [];
         return _this;
     }
     var _proto = TimelinePlayable.prototype;
@@ -19044,25 +19050,18 @@ var TimelinePlayable = /*#__PURE__*/ function(Playable) {
     };
     _proto.compileTracks = function compileTracks(graph, tracks) {
         this.sortTracks(tracks);
-        for(var _iterator = _create_for_of_iterator_helper_loose(tracks), _step; !(_step = _iterator()).done;){
-            var track = _step.value;
-            if (_instanceof1(track, exports.ObjectBindingTrack)) {
-                track.create();
-            }
-            this.masterTracks.push(track);
-        }
         var outputTrack = [];
-        for(var _iterator1 = _create_for_of_iterator_helper_loose(tracks), _step1; !(_step1 = _iterator1()).done;){
-            var masterTrack = _step1.value;
+        for(var _iterator = _create_for_of_iterator_helper_loose(tracks), _step; !(_step = _iterator()).done;){
+            var masterTrack = _step.value;
             outputTrack.push(masterTrack);
             this.addSubTracksRecursive(masterTrack, outputTrack);
         }
-        for(var _iterator2 = _create_for_of_iterator_helper_loose(outputTrack), _step2; !(_step2 = _iterator2()).done;){
-            var track1 = _step2.value;
-            var trackMixPlayable = track1.createPlayableGraph(graph, this.clips);
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(outputTrack), _step1; !(_step1 = _iterator1()).done;){
+            var track = _step1.value;
+            var trackMixPlayable = track.createPlayableGraph(graph, this.clips);
             this.addInput(trackMixPlayable, 0);
-            var trackOutput = track1.createOutput();
-            trackOutput.setUserData(track1.binding);
+            var trackOutput = track.createOutput();
+            trackOutput.setUserData(track.binding);
             graph.addOutput(trackOutput);
             trackOutput.setSourcePlayeble(this, this.getInputCount() - 1);
         }
@@ -19106,98 +19105,375 @@ function isAncestor(ancestorCandidate, descendantCandidate) {
     return false;
 }
 function compareTracks(a, b) {
-    if (isAncestor(a.track.binding, b.track.binding)) {
+    var bindingA = a.track.binding;
+    var bindingB = b.track.binding;
+    if (!_instanceof1(bindingA, exports.VFXItem) || !_instanceof1(bindingB, exports.VFXItem)) {
+        return a.originalIndex - b.originalIndex;
+    }
+    if (isAncestor(bindingA, bindingB)) {
         return -1;
-    } else if (isAncestor(b.track.binding, a.track.binding)) {
+    } else if (isAncestor(bindingB, bindingA)) {
         return 1;
     } else {
         return a.originalIndex - b.originalIndex; // 非父子关系的元素保持原始顺序
     }
 }
 
-function _possible_constructor_return(self, call) {
-    if (call && (_type_of(call) === "object" || typeof call === "function")) return call;
-    return _assert_this_initialized(self);
-}
-
-var TextLayout = /*#__PURE__*/ function() {
-    function TextLayout(options) {
-        this.width = 0;
-        this.height = 0;
-        var _options_textHeight = options.textHeight, textHeight = _options_textHeight === void 0 ? 100 : _options_textHeight, _options_textWidth = options.textWidth, textWidth = _options_textWidth === void 0 ? 100 : _options_textWidth, _options_textOverflow = options.textOverflow, textOverflow = _options_textOverflow === void 0 ? TextOverflow.display : _options_textOverflow, _options_textBaseline = options.textBaseline, textBaseline = _options_textBaseline === void 0 ? TextBaseline.top : _options_textBaseline, _options_textAlign = options.textAlign, textAlign = _options_textAlign === void 0 ? TextAlignment.left : _options_textAlign, text = options.text, _options_letterSpace = options.letterSpace, letterSpace = _options_letterSpace === void 0 ? 0 : _options_letterSpace, _options_autoWidth = options.autoWidth, autoWidth = _options_autoWidth === void 0 ? false : _options_autoWidth, fontSize = options.fontSize, _options_lineHeight = options.lineHeight, lineHeight = _options_lineHeight === void 0 ? fontSize : _options_lineHeight;
-        var tempWidth = fontSize + letterSpace;
-        this.autoWidth = autoWidth;
-        this.maxTextWidth = text.length * tempWidth;
-        // if (autoWidth) {
-        //   this.width = this.maxTextWidth + this.lineWidth;
-        //   this.height = fontSize + this.lineHeight;
-        // } else {
-        //   if (textWidth) {
-        //     this.maxCharCount = Math.floor((textWidth - this.lineWidth) / (tempWidth));
-        //     this.width = textWidth;
-        //   } else {
-        //     this.width = basicScale[0] * 100;
-        //   }
-        //   this.height = basicScale[1] * 100;
-        // }
-        this.width = textWidth;
-        this.height = textHeight;
-        this.letterSpace = letterSpace;
-        this.overFlow = textOverflow;
-        this.textBaseline = textBaseline;
-        this.textAlign = textAlign;
-        this.lineHeight = lineHeight;
+/**
+ * @since 2.0.0
+ * @internal
+ */ var CompositionComponent = /*#__PURE__*/ function(ItemBehaviour) {
+    _inherits(CompositionComponent, ItemBehaviour);
+    function CompositionComponent() {
+        var _this;
+        _this = ItemBehaviour.apply(this, arguments) || this;
+        _this.time = 0;
+        _this.startTime = 0;
+        _this.items = [] // 场景的所有元素
+        ;
+        _this.reusable = false;
+        _this.sceneBindings = [];
+        _this.graph = new PlayableGraph();
+        return _this;
     }
-    var _proto = TextLayout.prototype;
-    _proto.getOffsetY = function getOffsetY(style) {
-        var offsetY = 0;
-        var offset = (style.fontSize + style.outlineWidth) * style.fontScale;
-        switch(this.textBaseline){
-            case TextBaseline.top:
-                offsetY = offset;
-                break;
-            case TextBaseline.middle:
-                offsetY = (this.height + offset) / 2; // fonSize;
-                break;
-            case TextBaseline.bottom:
-                offsetY = this.height - offset / 2;
-                break;
+    var _proto = CompositionComponent.prototype;
+    _proto.start = function start() {
+        var _this_item_props = this.item.props, _this_item_props_startTime = _this_item_props.startTime, startTime = _this_item_props_startTime === void 0 ? 0 : _this_item_props_startTime;
+        this.startTime = startTime;
+        this.resolveBindings();
+        this.timelinePlayable = this.timelineAsset.createPlayable(this.graph);
+        this.timelinePlayable.play();
+        // 重播不销毁元素
+        if (this.item.endBehavior !== ItemEndBehavior.destroy) {
+            this.setReusable(true);
         }
-        return offsetY;
     };
-    _proto.getOffsetX = function getOffsetX(style, maxWidth) {
-        var offsetX = 0;
-        switch(this.textAlign){
-            case TextAlignment.left:
-                offsetX = style.outlineWidth * style.fontScale;
-                break;
-            case TextAlignment.middle:
-                offsetX = (this.width * style.fontScale - maxWidth) / 2;
-                break;
-            case TextAlignment.right:
-                offsetX = this.width * style.fontScale - maxWidth;
-                break;
+    _proto.setReusable = function setReusable(value) {
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.timelineAsset.tracks), _step; !(_step = _iterator()).done;){
+            var track = _step.value;
+            var binding = track.binding;
+            if (_instanceof1(binding, exports.VFXItem)) {
+                if (_instanceof1(track, exports.ObjectBindingTrack)) {
+                    binding.reusable = value;
+                }
+                var subCompositionComponent = binding.getComponent(CompositionComponent);
+                if (subCompositionComponent) {
+                    subCompositionComponent.setReusable(value);
+                }
+            }
         }
-        return offsetX;
     };
-    /**
-   * 设置文本框的宽度和高度
-   * @param width 文本框宽度
-   * @param height 文本框高度
-   */ _proto.setSize = function setSize(width, height) {
-        this.width = width;
-        this.height = height;
+    _proto.getReusable = function getReusable() {
+        return this.reusable;
     };
-    return TextLayout;
-}();
-
-var TextStyle = function TextStyle(options) {
-    /**
-   * 是否有下划线（暂时无效）
-   */ this.isUnderline = false // ttf
-    ;
-    /**
-   * 下划线高度（暂时无效）
+    _proto.update = function update(dt) {
+        var time = this.time;
+        // 主合成 rootItem 没有绑定轨道，增加结束行为判断。
+        if (this.item.isEnded(this.time) && !this.item.parent) {
+            this.item.ended = true;
+        }
+        this.timelinePlayable.setTime(time);
+        this.graph.evaluate(dt);
+    };
+    _proto.createContent = function createContent() {
+        var sceneBindings = [];
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.data.sceneBindings), _step; !(_step = _iterator()).done;){
+            var sceneBindingData = _step.value;
+            sceneBindings.push({
+                key: this.engine.assetLoader.loadGUID(sceneBindingData.key.id),
+                value: this.engine.assetLoader.loadGUID(sceneBindingData.value.id)
+            });
+        }
+        this.sceneBindings = sceneBindings;
+        var timelineAsset = this.data.timelineAsset ? this.engine.assetLoader.loadGUID(this.data.timelineAsset.id) : new exports.TimelineAsset(this.engine);
+        this.timelineAsset = timelineAsset;
+        var items = this.items;
+        this.items.length = 0;
+        if (this.item.composition) {
+            var assetLoader = this.item.engine.assetLoader;
+            var itemProps = this.item.props.items ? this.item.props.items : [];
+            for(var i = 0; i < itemProps.length; i++){
+                var item = void 0;
+                var itemData = itemProps[i];
+                // 设置预合成作为元素时的时长、结束行为和渲染延时
+                if (exports.Item.isComposition(itemData)) {
+                    var refId = itemData.content.options.refId;
+                    var props = this.item.composition.refCompositionProps.get(refId);
+                    if (!props) {
+                        throw new Error("引用的Id: " + refId + " 的预合成不存在");
+                    }
+                    // endBehaviour 类型需优化
+                    props.content = itemData.content;
+                    item = assetLoader.loadGUID(itemData.id);
+                    item.composition = this.item.composition;
+                    var compositionComponent = item.addComponent(CompositionComponent);
+                    compositionComponent.data = props;
+                    compositionComponent.refId = refId;
+                    item.transform.parentTransform = this.transform;
+                    this.item.composition.refContent.push(item);
+                    if (item.endBehavior === ItemEndBehavior.loop) {
+                        this.item.composition.autoRefTex = false;
+                    }
+                    compositionComponent.createContent();
+                    for(var _iterator1 = _create_for_of_iterator_helper_loose(compositionComponent.items), _step1; !(_step1 = _iterator1()).done;){
+                        var vfxItem = _step1.value;
+                        vfxItem.setInstanceId(generateGUID());
+                        for(var _iterator2 = _create_for_of_iterator_helper_loose(vfxItem.components), _step2; !(_step2 = _iterator2()).done;){
+                            var component = _step2.value;
+                            component.setInstanceId(generateGUID());
+                        }
+                    }
+                } else {
+                    item = assetLoader.loadGUID(itemData.id);
+                    item.composition = this.item.composition;
+                }
+                item.parent = this.item;
+                // 相机不跟随合成移动
+                item.transform.parentTransform = itemData.type === ItemType.camera ? new Transform() : this.transform;
+                if (exports.VFXItem.isExtraCamera(item)) {
+                    this.item.composition.extraCamera = item;
+                }
+                items.push(item);
+            }
+        }
+    };
+    _proto.onDestroy = function onDestroy() {
+        if (this.item.composition) {
+            if (this.items) {
+                this.items.forEach(function(item) {
+                    return item.dispose();
+                });
+                this.items.length = 0;
+            }
+        }
+    };
+    _proto.hitTest = function hitTest(ray, x, y, regions, force, options) {
+        var _this, _loop = function(i) {
+            var item = _this.items[i];
+            if (item.getVisible() && !item.ended && !exports.VFXItem.isComposition(item) && !skip(item)) {
+                var hitParams = item.getHitTestParams(force);
+                if (hitParams) {
+                    var success = false;
+                    var intersectPoint = new Vector3();
+                    if (hitParams.type === exports.HitTestType.triangle) {
+                        var triangles = hitParams.triangles, backfaceCulling = hitParams.backfaceCulling;
+                        for(var j = 0; j < triangles.length; j++){
+                            var triangle = triangles[j];
+                            if (ray.intersectTriangle(triangle, intersectPoint, backfaceCulling)) {
+                                success = true;
+                                hitPositions.push(intersectPoint);
+                                break;
+                            }
+                        }
+                    } else if (hitParams.type === exports.HitTestType.box) {
+                        var center = hitParams.center, size = hitParams.size;
+                        var boxMin = center.clone().addScaledVector(size, 0.5);
+                        var boxMax = center.clone().addScaledVector(size, -0.5);
+                        if (ray.intersectBox({
+                            min: boxMin,
+                            max: boxMax
+                        }, intersectPoint)) {
+                            success = true;
+                            hitPositions.push(intersectPoint);
+                        }
+                    } else if (hitParams.type === exports.HitTestType.sphere) {
+                        var center1 = hitParams.center, radius = hitParams.radius;
+                        if (ray.intersectSphere({
+                            center: center1,
+                            radius: radius
+                        }, intersectPoint)) {
+                            success = true;
+                            hitPositions.push(intersectPoint);
+                        }
+                    } else if (hitParams.type === exports.HitTestType.custom) {
+                        var tempPosition = hitParams.collect(ray, new Vector2(x, y));
+                        if (tempPosition && tempPosition.length > 0) {
+                            tempPosition.forEach(function(pos) {
+                                hitPositions.push(pos);
+                            });
+                            success = true;
+                        }
+                    }
+                    if (success) {
+                        var region = {
+                            compContent: _this.item,
+                            id: item.id,
+                            name: item.name,
+                            position: hitPositions[hitPositions.length - 1],
+                            parentId: item.parentId,
+                            hitPositions: hitPositions,
+                            behavior: hitParams.behavior
+                        };
+                        regions.push(region);
+                        if (stop(region)) {
+                            return {
+                                v: regions
+                            };
+                        }
+                    }
+                }
+            }
+        };
+        var hitPositions = [];
+        var stop = (options == null ? void 0 : options.stop) || noop;
+        var skip = (options == null ? void 0 : options.skip) || noop;
+        var maxCount = (options == null ? void 0 : options.maxCount) || this.items.length;
+        for(var i = 0; i < this.items.length && regions.length < maxCount; i++){
+            var _ret = (_this = this, _loop(i));
+            if (_type_of(_ret) === "object") return _ret.v;
+        }
+        return regions;
+    };
+    _proto.fromData = function fromData(data) {};
+    _proto.resolveBindings = function resolveBindings() {
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.sceneBindings), _step; !(_step = _iterator()).done;){
+            var sceneBinding = _step.value;
+            sceneBinding.key.binding = sceneBinding.value;
+        }
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(this.timelineAsset.tracks), _step1; !(_step1 = _iterator1()).done;){
+            var masterTrack = _step1.value;
+            this.resolveTrackBindingsWithRoot(masterTrack);
+        }
+    };
+    _proto.resolveTrackBindingsWithRoot = function resolveTrackBindingsWithRoot(track) {
+        for(var _iterator = _create_for_of_iterator_helper_loose(track.getChildTracks()), _step; !(_step = _iterator()).done;){
+            var subTrack = _step.value;
+            subTrack.binding = subTrack.resolveBinding(track.binding);
+            this.resolveTrackBindingsWithRoot(subTrack);
+        }
+    };
+    return CompositionComponent;
+}(ItemBehaviour);
+
+exports.SubCompositionTrack = /*#__PURE__*/ function(TrackAsset) {
+    _inherits(SubCompositionTrack, TrackAsset);
+    function SubCompositionTrack() {
+        return TrackAsset.apply(this, arguments);
+    }
+    var _proto = SubCompositionTrack.prototype;
+    _proto.resolveBinding = function resolveBinding(parentBinding) {
+        if (!_instanceof1(parentBinding, exports.VFXItem)) {
+            throw new Error("SubCompositionTrack needs to be set under the VFXItem track");
+        }
+        return parentBinding.getComponent(CompositionComponent);
+    };
+    return SubCompositionTrack;
+}(exports.TrackAsset);
+exports.SubCompositionTrack = __decorate([
+    effectsClass("SubCompositionTrack")
+], exports.SubCompositionTrack);
+
+var SubCompositionClipPlayable = /*#__PURE__*/ function(Playable) {
+    _inherits(SubCompositionClipPlayable, Playable);
+    function SubCompositionClipPlayable() {
+        return Playable.apply(this, arguments);
+    }
+    var _proto = SubCompositionClipPlayable.prototype;
+    _proto.processFrame = function processFrame(context) {
+        var boundObject = context.output.getUserData();
+        boundObject.time = this.getTime();
+    };
+    return SubCompositionClipPlayable;
+}(Playable);
+
+exports.SubCompositionPlayableAsset = /*#__PURE__*/ function(PlayableAsset) {
+    _inherits(SubCompositionPlayableAsset, PlayableAsset);
+    function SubCompositionPlayableAsset() {
+        return PlayableAsset.apply(this, arguments);
+    }
+    var _proto = SubCompositionPlayableAsset.prototype;
+    _proto.createPlayable = function createPlayable(graph) {
+        return new SubCompositionClipPlayable(graph);
+    };
+    return SubCompositionPlayableAsset;
+}(PlayableAsset);
+exports.SubCompositionPlayableAsset = __decorate([
+    effectsClass("SubCompositionPlayableAsset")
+], exports.SubCompositionPlayableAsset);
+
+function _possible_constructor_return(self, call) {
+    if (call && (_type_of(call) === "object" || typeof call === "function")) return call;
+    return _assert_this_initialized(self);
+}
+
+var TextLayout = /*#__PURE__*/ function() {
+    function TextLayout(options) {
+        this.width = 0;
+        this.height = 0;
+        var _options_textHeight = options.textHeight, textHeight = _options_textHeight === void 0 ? 100 : _options_textHeight, _options_textWidth = options.textWidth, textWidth = _options_textWidth === void 0 ? 100 : _options_textWidth, _options_textOverflow = options.textOverflow, textOverflow = _options_textOverflow === void 0 ? TextOverflow.display : _options_textOverflow, _options_textBaseline = options.textBaseline, textBaseline = _options_textBaseline === void 0 ? TextBaseline.top : _options_textBaseline, _options_textAlign = options.textAlign, textAlign = _options_textAlign === void 0 ? TextAlignment.left : _options_textAlign, text = options.text, _options_letterSpace = options.letterSpace, letterSpace = _options_letterSpace === void 0 ? 0 : _options_letterSpace, _options_autoWidth = options.autoWidth, autoWidth = _options_autoWidth === void 0 ? false : _options_autoWidth, fontSize = options.fontSize, _options_lineHeight = options.lineHeight, lineHeight = _options_lineHeight === void 0 ? fontSize : _options_lineHeight;
+        var tempWidth = fontSize + letterSpace;
+        this.autoWidth = autoWidth;
+        this.maxTextWidth = text.length * tempWidth;
+        // if (autoWidth) {
+        //   this.width = this.maxTextWidth + this.lineWidth;
+        //   this.height = fontSize + this.lineHeight;
+        // } else {
+        //   if (textWidth) {
+        //     this.maxCharCount = Math.floor((textWidth - this.lineWidth) / (tempWidth));
+        //     this.width = textWidth;
+        //   } else {
+        //     this.width = basicScale[0] * 100;
+        //   }
+        //   this.height = basicScale[1] * 100;
+        // }
+        this.width = textWidth;
+        this.height = textHeight;
+        this.letterSpace = letterSpace;
+        this.overFlow = textOverflow;
+        this.textBaseline = textBaseline;
+        this.textAlign = textAlign;
+        this.lineHeight = lineHeight;
+    }
+    var _proto = TextLayout.prototype;
+    _proto.getOffsetY = function getOffsetY(style) {
+        var offsetY = 0;
+        var offset = (style.fontSize + style.outlineWidth) * style.fontScale;
+        switch(this.textBaseline){
+            case TextBaseline.top:
+                offsetY = offset;
+                break;
+            case TextBaseline.middle:
+                offsetY = (this.height + offset) / 2; // fonSize;
+                break;
+            case TextBaseline.bottom:
+                offsetY = this.height - offset / 2;
+                break;
+        }
+        return offsetY;
+    };
+    _proto.getOffsetX = function getOffsetX(style, maxWidth) {
+        var offsetX = 0;
+        switch(this.textAlign){
+            case TextAlignment.left:
+                offsetX = style.outlineWidth * style.fontScale;
+                break;
+            case TextAlignment.middle:
+                offsetX = (this.width * style.fontScale - maxWidth) / 2;
+                break;
+            case TextAlignment.right:
+                offsetX = this.width * style.fontScale - maxWidth;
+                break;
+        }
+        return offsetX;
+    };
+    /**
+   * 设置文本框的宽度和高度
+   * @param width 文本框宽度
+   * @param height 文本框高度
+   */ _proto.setSize = function setSize(width, height) {
+        this.width = width;
+        this.height = height;
+    };
+    return TextLayout;
+}();
+
+var TextStyle = function TextStyle(options) {
+    /**
+   * 是否有下划线（暂时无效）
+   */ this.isUnderline = false // ttf
+    ;
+    /**
+   * 下划线高度（暂时无效）
    */ this.underlineHeight = 1 // ttf
     ;
     /**
@@ -20694,6 +20970,9 @@ var SerializationHelper = /*#__PURE__*/ function() {
     SerializationHelper.checkGLTFNode = function checkGLTFNode(value) {
         return _instanceof1(value, Object) && value.nodeIndex !== undefined && value.isJoint !== undefined;
     };
+    SerializationHelper.checkImageSource = function checkImageSource(value) {
+        return isCanvas(value) || _instanceof1(value, HTMLImageElement);
+    };
     SerializationHelper.deserializeProperty = function deserializeProperty(property, engine, level, type) {
         if (level > 14) {
             console.error("序列化数据的内嵌对象层数大于上限");
@@ -20711,7 +20990,7 @@ var SerializationHelper = /*#__PURE__*/ function() {
         // TODO json 数据避免传 typedArray
         } else if (SerializationHelper.checkDataPath(property)) {
             return engine.assetLoader.loadGUID(property.id);
-        } else if (_instanceof1(property, EffectsObject) || SerializationHelper.checkTypedArray(property) || SerializationHelper.checkGLTFNode(property)) {
+        } else if (_instanceof1(property, EffectsObject) || SerializationHelper.checkImageSource(property) || SerializationHelper.checkTypedArray(property) || SerializationHelper.checkGLTFNode(property)) {
             return property;
         } else if (_instanceof1(property, Object)) {
             var res1;
@@ -20799,7 +21078,7 @@ var SerializationHelper = /*#__PURE__*/ function() {
                             res1
                         ];
                     case 8:
-                        if (_instanceof1(property, EffectsObject) || SerializationHelper.checkTypedArray(property) || SerializationHelper.checkGLTFNode(property)) {
+                        if (_instanceof1(property, EffectsObject) || SerializationHelper.checkImageSource(property) || SerializationHelper.checkTypedArray(property) || SerializationHelper.checkGLTFNode(property)) {
                             return [
                                 2,
                                 property
@@ -20922,9 +21201,8 @@ var SerializationHelper = /*#__PURE__*/ function() {
                 effectsObject = Geometry.create(this.engine);
                 break;
             case DataType.Texture:
-                // @ts-expect-error
-                effectsObject = Texture.create(this.engine, effectsObjectData);
-                return effectsObject;
+                effectsObject = Texture.create(this.engine);
+                break;
             default:
                 {
                     var classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
@@ -20995,12 +21273,8 @@ var SerializationHelper = /*#__PURE__*/ function() {
                                 effectsObject = Geometry.create(_this.engine);
                                 break;
                             case DataType.Texture:
-                                // @ts-expect-error
-                                effectsObject = Texture.create(_this.engine, effectsObjectData);
-                                return [
-                                    2,
-                                    effectsObject
-                                ];
+                                effectsObject = Texture.create(_this.engine);
+                                break;
                             default:
                                 {
                                     classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
@@ -21920,8 +22194,15 @@ function getStandardCameraContent(model) {
                 id: item.id
             };
         });
+        var compositionData = _extends({}, composition, {
+            timelineAsset: {
+                id: ""
+            },
+            sceneBindings: []
+        });
+        result.compositions.push(compositionData);
         // 生成时间轴数据
-        convertTimelineAsset(composition, guidToItemMap, result);
+        convertTimelineAsset(compositionData, guidToItemMap, result);
     };
     var // 更正 spine 数据中的 images 属性
     _json_spines;
@@ -21929,6 +22210,7 @@ function getStandardCameraContent(model) {
     _result;
     var result = _extends({}, json, {
         items: [],
+        compositions: [],
         components: [],
         materials: [],
         shaders: [],
@@ -22085,7 +22367,7 @@ function getStandardCameraContent(model) {
             content1.renderer.anchor = convertAnchor(renderer1.anchor, renderer1.particleOrigin);
         }
         // 修复相机K帧缺失 asMovement 参数
-        if (item.type === ItemType.camera) {
+        if (item.type === ItemType.camera && item.content.positionOverLifetime && Object.keys(item.content.positionOverLifetime).length !== 0) {
             item.content.positionOverLifetime.asMovement = true;
         }
         // 动画数据转化 TODO: 动画数据移到 TimelineComponentData
@@ -22138,10 +22420,7 @@ function getStandardCameraContent(model) {
             item.type = "orientation-transformer";
         }
         // item 的 content 转为 component data 加入 JSONScene.components
-        if (item.type === ItemType.sprite || item.type === ItemType.particle || item.type === ItemType.mesh || item.type === ItemType.skybox || item.type === ItemType.light || // @ts-expect-error
-        item.type === "camera" || item.type === ItemType.tree || item.type === ItemType.interact || item.type === ItemType.camera || item.type === ItemType.text || item.type === ItemType.spine || // @ts-expect-error
-        item.type === "editor-gizmo" || // @ts-expect-error
-        item.type === "orientation-transformer") {
+        if (item.type === ItemType.sprite || item.type === ItemType.particle || item.type === ItemType.mesh || item.type === ItemType.skybox || item.type === ItemType.light || item.type === "camera" || item.type === ItemType.tree || item.type === ItemType.interact || item.type === ItemType.camera || item.type === ItemType.text || item.type === ItemType.spine || item.type === "editor-gizmo" || item.type === "orientation-transformer") {
             item.components = [];
             result.components.push(item.content);
             item.content.id = generateGUID();
@@ -22173,15 +22452,12 @@ function getStandardCameraContent(model) {
             case ItemType.light:
                 item.content.dataType = DataType.LightComponent;
                 break;
-            // @ts-expect-error
             case "camera":
                 item.content.dataType = DataType.CameraComponent;
                 break;
-            // @ts-expect-error
             case "editor-gizmo":
                 item.content.dataType = "GizmoComponent";
                 break;
-            // @ts-expect-error
             case "orientation-transformer":
                 item.content.dataType = "OrientationComponent";
                 break;
@@ -22250,8 +22526,32 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
         var itemDataPath = _step.value;
         var item = guidToItemMap[itemDataPath.id];
         var subTrackDatas = [];
+        var newActivationPlayableAsset = {
+            id: generateGUID(),
+            dataType: "ActivationPlayableAsset"
+        };
+        playableAssetDatas.push(newActivationPlayableAsset);
+        var newActivationTrackData = {
+            id: generateGUID(),
+            dataType: "ActivationTrack",
+            children: [],
+            clips: [
+                {
+                    start: item.delay,
+                    duration: item.duration,
+                    endBehaviour: item.endBehavior,
+                    asset: {
+                        id: newActivationPlayableAsset.id
+                    }
+                }
+            ]
+        };
+        subTrackDatas.push({
+            id: newActivationTrackData.id
+        });
+        trackDatas.push(newActivationTrackData);
         if (item.type !== ItemType.particle) {
-            var newPlayableAssetData = {
+            var newTransformPlayableAssetData = {
                 id: generateGUID(),
                 dataType: "TransformPlayableAsset",
                 //@ts-expect-error
@@ -22261,15 +22561,18 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
                 //@ts-expect-error
                 positionOverLifetime: item.content.positionOverLifetime
             };
-            playableAssetDatas.push(newPlayableAssetData);
+            playableAssetDatas.push(newTransformPlayableAssetData);
             var newTrackData = {
                 id: generateGUID(),
                 dataType: "TransformTrack",
                 children: [],
                 clips: [
                     {
+                        start: item.delay,
+                        duration: item.duration,
+                        endBehaviour: item.endBehavior,
                         asset: {
-                            id: newPlayableAssetData.id
+                            id: newTransformPlayableAssetData.id
                         }
                     }
                 ]
@@ -22280,21 +22583,24 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
             trackDatas.push(newTrackData);
         }
         if (item.type === ItemType.sprite) {
-            var newPlayableAssetData1 = {
+            var newSpriteColorPlayableAssetData = {
                 id: generateGUID(),
                 dataType: "SpriteColorPlayableAsset",
                 colorOverLifetime: item.content.colorOverLifetime,
                 startColor: item.content.options.startColor
             };
-            playableAssetDatas.push(newPlayableAssetData1);
+            playableAssetDatas.push(newSpriteColorPlayableAssetData);
             var newTrackData1 = {
                 id: generateGUID(),
                 dataType: "SpriteColorTrack",
                 children: [],
                 clips: [
                     {
+                        start: item.delay,
+                        duration: item.duration,
+                        endBehaviour: item.endBehavior,
                         asset: {
-                            id: newPlayableAssetData1.id
+                            id: newSpriteColorPlayableAssetData.id
                         }
                     }
                 ]
@@ -22304,6 +22610,32 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
             });
             trackDatas.push(newTrackData1);
         }
+        if (item.type === ItemType.composition) {
+            var newSubCompositionPlayableAssetData = {
+                id: generateGUID(),
+                dataType: "SubCompositionPlayableAsset"
+            };
+            playableAssetDatas.push(newSubCompositionPlayableAssetData);
+            var newTrackData2 = {
+                id: generateGUID(),
+                dataType: "SubCompositionTrack",
+                children: [],
+                clips: [
+                    {
+                        start: item.delay,
+                        duration: item.duration,
+                        endBehaviour: item.endBehavior,
+                        asset: {
+                            id: newSubCompositionPlayableAssetData.id
+                        }
+                    }
+                ]
+            };
+            subTrackDatas.push({
+                id: newTrackData2.id
+            });
+            trackDatas.push(newTrackData2);
+        }
         var bindingTrackData = {
             id: generateGUID(),
             dataType: "ObjectBindingTrack",
@@ -22330,11 +22662,9 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
             id: trackData.id
         });
     }
-    //@ts-expect-error
     composition.timelineAsset = {
         id: timelineAssetData.id
     };
-    //@ts-expect-error
     composition.sceneBindings = sceneBindings;
     if (!jsonScene.animations) {
         jsonScene.animations = [];
@@ -23579,42 +23909,6 @@ function createTextureOptionsBySource(image, sourceFrom) {
     }
     throw new Error("Invalid texture options");
 }
-function base64ToFile(base64, filename, contentType) {
-    if (filename === void 0) filename = "base64File";
-    if (contentType === void 0) contentType = "";
-    // 去掉 Base64 字符串的 Data URL 部分（如果存在）
-    var base64WithoutPrefix = base64.split(",")[1] || base64;
-    // 将 base64 编码的字符串转换为二进制字符串
-    var byteCharacters = atob(base64WithoutPrefix);
-    // 创建一个 8 位无符号整数值的数组，即“字节数组”
-    var byteArrays = [];
-    // 切割二进制字符串为多个片段，并将每个片段转换成一个字节数组
-    for(var offset = 0; offset < byteCharacters.length; offset += 512){
-        var slice = byteCharacters.slice(offset, offset + 512);
-        var byteNumbers = new Array(slice.length);
-        for(var i = 0; i < slice.length; i++){
-            byteNumbers[i] = slice.charCodeAt(i);
-        }
-        var byteArray = new Uint8Array(byteNumbers);
-        byteArrays.push(byteArray);
-    }
-    // 使用字节数组创建 Blob 对象
-    var blob = new Blob(byteArrays, {
-        type: contentType
-    });
-    // 创建 File 对象
-    var file = new File([
-        blob
-    ], filename, {
-        type: contentType
-    });
-    return file;
-}
-function isCanvas(canvas) {
-    var _canvas_tagName;
-    // 小程序 Canvas 无法使用 instanceof HTMLCanvasElement 判断
-    return typeof canvas === "object" && canvas !== null && ((_canvas_tagName = canvas.tagName) == null ? void 0 : _canvas_tagName.toUpperCase()) === "CANVAS";
-}
 
 var tmpScale = new Vector3(1, 1, 1);
 /**
@@ -23892,257 +24186,213 @@ var tmpScale = new Vector3(1, 1, 1);
     return Camera;
 }();
 
+var listOrder = 0;
 /**
- * @since 2.0.0
- * @internal
- */ var CompositionComponent = /*#__PURE__*/ function(ItemBehaviour) {
-    _inherits(CompositionComponent, ItemBehaviour);
-    function CompositionComponent() {
-        var _this;
-        _this = ItemBehaviour.apply(this, arguments) || this;
-        _this.time = 0;
-        _this.startTime = 0;
-        _this.items = [] // 场景的所有元素
-        ;
-        _this.reusable = false;
-        _this.sceneBindings = [];
-        _this.masterTracks = [];
-        _this.graph = new PlayableGraph();
-        return _this;
+ * 合成资源管理
+ */ var CompositionSourceManager = /*#__PURE__*/ function() {
+    function CompositionSourceManager(scene, engine) {
+        this.refCompositions = new Map();
+        this.refCompositionProps = new Map();
+        this.mask = 0;
+        this.engine = engine;
+        // 资源
+        var jsonScene = scene.jsonScene, renderLevel = scene.renderLevel, textureOptions = scene.textureOptions, pluginSystem = scene.pluginSystem, totalTime = scene.totalTime;
+        var compositions = jsonScene.compositions, imgUsage = jsonScene.imgUsage, compositionId = jsonScene.compositionId;
+        if (!textureOptions) {
+            throw new Error("scene.textures expected");
+        }
+        var cachedTextures = textureOptions;
+        for(var _iterator = _create_for_of_iterator_helper_loose(compositions), _step; !(_step = _iterator()).done;){
+            var comp = _step.value;
+            if (comp.id === compositionId) {
+                this.composition = comp;
+            } else {
+                this.refCompositions.set(comp.id, comp);
+            }
+        }
+        if (!this.composition) {
+            throw new Error("Invalid composition id: " + compositionId);
+        }
+        this.jsonScene = jsonScene;
+        this.renderLevel = renderLevel;
+        this.pluginSystem = pluginSystem;
+        this.totalTime = totalTime != null ? totalTime : 0;
+        this.imgUsage = imgUsage != null ? imgUsage : {};
+        this.textures = cachedTextures;
+        listOrder = 0;
+        this.sourceContent = this.getContent(this.composition);
     }
-    var _proto = CompositionComponent.prototype;
-    _proto.start = function start() {
-        var _this_item_props = this.item.props, _this_item_props_startTime = _this_item_props.startTime, startTime = _this_item_props_startTime === void 0 ? 0 : _this_item_props_startTime;
-        this.startTime = startTime;
-        this.masterTracks = [];
-        for(var _iterator = _create_for_of_iterator_helper_loose(this.sceneBindings), _step; !(_step = _iterator()).done;){
-            var sceneBinding = _step.value;
-            sceneBinding.key.binding = sceneBinding.value;
+    var _proto = CompositionSourceManager.prototype;
+    _proto.getContent = function getContent(composition) {
+        // TODO: specification 中补充 globalVolume 类型
+        // @ts-expect-error
+        var id = composition.id, duration = composition.duration, name = composition.name, endBehavior = composition.endBehavior, camera = composition.camera, globalVolume = composition.globalVolume, _composition_startTime = composition.startTime, startTime = _composition_startTime === void 0 ? 0 : _composition_startTime;
+        var items = this.assembleItems(composition);
+        return _extends({}, composition, {
+            id: id,
+            duration: duration,
+            name: name,
+            endBehavior: isNaN(endBehavior) ? END_BEHAVIOR_PAUSE : endBehavior,
+            // looping,
+            items: items,
+            camera: camera,
+            startTime: startTime,
+            globalVolume: globalVolume
+        });
+    };
+    _proto.assembleItems = function assembleItems(composition) {
+        var _this = this;
+        var items = [];
+        this.mask++;
+        var componentMap = {};
+        //@ts-expect-error
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.jsonScene.components), _step; !(_step = _iterator()).done;){
+            var component = _step.value;
+            componentMap[component.id] = component;
         }
-        this.initializeTrackBindings(this.timelineAsset.tracks);
-        this.timelinePlayable = this.timelineAsset.createPlayable(this.graph);
-        this.timelinePlayable.play();
-        for(var _iterator1 = _create_for_of_iterator_helper_loose(this.timelineAsset.tracks), _step1; !(_step1 = _iterator1()).done;){
-            var track = _step1.value;
-            // 重播不销毁元素
-            if (this.item.endBehavior !== ItemEndBehavior.destroy || this.reusable) {
-                if (_instanceof1(track, exports.ObjectBindingTrack)) {
-                    track.binding.reusable = true;
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(composition.items), _step1; !(_step1 = _iterator1()).done;){
+            var itemDataPath = _step1.value;
+            //@ts-expect-error
+            var sourceItemData = this.engine.jsonSceneData[itemDataPath.id];
+            var itemProps = sourceItemData;
+            if (passRenderLevel(sourceItemData.renderLevel, this.renderLevel)) {
+                if (itemProps.type === ItemType.sprite || itemProps.type === ItemType.particle) {
+                    for(var _iterator2 = _create_for_of_iterator_helper_loose(itemProps.components), _step2; !(_step2 = _iterator2()).done;){
+                        var componentPath = _step2.value;
+                        var componentData = componentMap[componentPath.id];
+                        this.preProcessItemContent(componentData);
+                    }
+                } else {
+                    var renderContent = itemProps.content;
+                    if (renderContent) {
+                        this.preProcessItemContent(renderContent);
+                    }
                 }
-                var subCompositionComponent = track.binding.getComponent(CompositionComponent);
-                if (subCompositionComponent) {
-                    subCompositionComponent.reusable = true;
+                itemProps.listIndex = listOrder++;
+                // 处理预合成的渲染顺序
+                if (itemProps.type === ItemType.composition) {
+                    var refId = sourceItemData.content.options.refId;
+                    if (!this.refCompositions.get(refId)) {
+                        throw new Error("Invalid Ref Composition id: " + refId);
+                    }
+                    var ref = this.getContent(this.refCompositions.get(refId));
+                    if (!this.refCompositionProps.has(refId)) {
+                        this.refCompositionProps.set(refId, ref);
+                    }
+                    ref.items.forEach(function(item) {
+                        _this.processMask(item.content);
+                    });
+                    itemProps.items = ref.items;
                 }
+                items.push(itemProps);
             }
-            this.masterTracks.push(track);
-        }
-    };
-    _proto.initializeTrackBindings = function initializeTrackBindings(masterTracks) {
-        for(var _iterator = _create_for_of_iterator_helper_loose(masterTracks), _step; !(_step = _iterator()).done;){
-            var track = _step.value;
-            track.initializeBindingRecursive(track.binding);
         }
+        return items;
     };
-    _proto.update = function update(dt) {
-        var time = this.time;
-        // 主合成 rootItem 没有绑定轨道，增加结束行为判断。
-        if (this.item.isEnded(this.time) && !this.item.parent) {
-            this.item.ended = true;
-        }
-        this.timelinePlayable.setTime(time);
-        this.graph.evaluate(dt);
-        for(var i = 0; i < this.items.length; i++){
-            var item = this.items[i];
-            var subCompostionComponent = item.getComponent(CompositionComponent);
-            if (subCompostionComponent) {
-                var subCompositionTrack = this.masterTracks[i];
-                subCompostionComponent.time = subCompositionTrack.toLocalTime(time);
+    _proto.preProcessItemContent = function preProcessItemContent(renderContent) {
+        if (renderContent.renderer) {
+            renderContent.renderer = this.changeTex(renderContent.renderer);
+            if (!renderContent.renderer.mask) {
+                this.processMask(renderContent.renderer);
+            }
+            var split = renderContent.splits && !renderContent.textureSheetAnimation && renderContent.splits[0];
+            if (Number.isInteger(renderContent.renderer.shape)) {
+                var _this_jsonScene;
+                // TODO: scene.shapes 类型问题？
+                renderContent.renderer.shape = getGeometryByShape((_this_jsonScene = this.jsonScene) == null ? void 0 : _this_jsonScene.shapes[renderContent.renderer.shape], split);
+            } else if (renderContent.renderer.shape && isObject(renderContent.renderer.shape)) {
+                renderContent.renderer.shape = getGeometryByShape(renderContent.renderer.shape, split);
             }
         }
+        if (renderContent.trails) {
+            renderContent.trails = this.changeTex(renderContent.trails);
+        }
     };
-    /**
-   * 重置元素状态属性
-   */ _proto.resetStatus = function resetStatus() {
-        this.item.ended = false;
-    };
-    _proto.createContent = function createContent() {
-        var sceneBindings = [];
-        for(var _iterator = _create_for_of_iterator_helper_loose(this.data.sceneBindings), _step; !(_step = _iterator()).done;){
-            var sceneBindingData = _step.value;
-            sceneBindings.push({
-                key: this.engine.assetLoader.loadGUID(sceneBindingData.key.id),
-                value: this.engine.assetLoader.loadGUID(sceneBindingData.value.id)
-            });
+    _proto.changeTex = function changeTex(renderer) {
+        if (!renderer.texture) {
+            return renderer;
         }
-        this.sceneBindings = sceneBindings;
-        var timelineAsset = this.data.timelineAsset ? this.engine.assetLoader.loadGUID(this.data.timelineAsset.id) : new exports.TimelineAsset(this.engine);
-        this.timelineAsset = timelineAsset;
-        var items = this.items;
-        this.items.length = 0;
-        if (this.item.composition) {
-            var assetLoader = this.item.engine.assetLoader;
-            var itemProps = this.item.props.items ? this.item.props.items : [];
-            for(var i = 0; i < itemProps.length; i++){
-                var item = void 0;
-                var itemData = itemProps[i];
-                // 设置预合成作为元素时的时长、结束行为和渲染延时
-                if (exports.Item.isComposition(itemData)) {
-                    var refId = itemData.content.options.refId;
-                    var props = this.item.composition.refCompositionProps.get(refId);
-                    if (!props) {
-                        throw new Error("引用的Id: " + refId + " 的预合成不存在");
-                    }
-                    // endBehaviour 类型需优化
-                    props.content = itemData.content;
-                    item = assetLoader.loadGUID(itemData.id);
-                    item.composition = this.item.composition;
-                    var compositionComponent = item.addComponent(CompositionComponent);
-                    compositionComponent.data = props;
-                    compositionComponent.refId = refId;
-                    item.transform.parentTransform = this.transform;
-                    this.item.composition.refContent.push(item);
-                    if (item.endBehavior === ItemEndBehavior.loop) {
-                        this.item.composition.autoRefTex = false;
-                    }
-                    compositionComponent.createContent();
-                    for(var _iterator1 = _create_for_of_iterator_helper_loose(compositionComponent.items), _step1; !(_step1 = _iterator1()).done;){
-                        var vfxItem = _step1.value;
-                        vfxItem.setInstanceId(generateGUID());
-                        for(var _iterator2 = _create_for_of_iterator_helper_loose(vfxItem.components), _step2; !(_step2 = _iterator2()).done;){
-                            var component = _step2.value;
-                            component.setInstanceId(generateGUID());
-                        }
-                    }
-                } else {
-                    item = assetLoader.loadGUID(itemData.id);
-                    item.composition = this.item.composition;
-                }
-                item.parent = this.item;
-                // 相机不跟随合成移动
-                item.transform.parentTransform = itemData.type === ItemType.camera ? new Transform() : this.transform;
-                if (exports.VFXItem.isExtraCamera(item)) {
-                    this.item.composition.extraCamera = item;
-                }
-                items.push(item);
-            }
+        //@ts-expect-error
+        var texIdx = renderer.texture.id;
+        if (texIdx !== undefined) {
+            //@ts-expect-error
+            this.addTextureUsage(texIdx) || texIdx;
         }
+        return renderer;
     };
-    _proto.onDestroy = function onDestroy() {
-        if (this.item.composition) {
-            if (this.items) {
-                this.items.forEach(function(item) {
-                    return item.dispose();
-                });
-                this.items.length = 0;
+    _proto.addTextureUsage = function addTextureUsage(texIdx) {
+        var texId = texIdx;
+        var _this_imgUsage;
+        // FIXME: imageUsage 取自 scene.imgUsage，类型为 Record<string, number[]>，这里给的 number，类型对不上
+        var imageUsage = (_this_imgUsage = this.imgUsage) != null ? _this_imgUsage : {};
+        if (texId && imageUsage) {
+            // eslint-disable-next-line no-prototype-builtins
+            if (!imageUsage.hasOwnProperty(texId)) {
+                imageUsage[texId] = 0;
             }
+            imageUsage[texId]++;
         }
     };
-    _proto.hitTest = function hitTest(ray, x, y, regions, force, options) {
-        var _this, _loop = function(i) {
-            var item = _this.items[i];
-            if (item.getVisible() && !item.ended && !exports.VFXItem.isComposition(item) && !skip(item)) {
-                var hitParams = item.getHitTestParams(force);
-                if (hitParams) {
-                    var success = false;
-                    var intersectPoint = new Vector3();
-                    if (hitParams.type === exports.HitTestType.triangle) {
-                        var triangles = hitParams.triangles, backfaceCulling = hitParams.backfaceCulling;
-                        for(var j = 0; j < triangles.length; j++){
-                            var triangle = triangles[j];
-                            if (ray.intersectTriangle(triangle, intersectPoint, backfaceCulling)) {
-                                success = true;
-                                hitPositions.push(intersectPoint);
-                                break;
-                            }
-                        }
-                    } else if (hitParams.type === exports.HitTestType.box) {
-                        var center = hitParams.center, size = hitParams.size;
-                        var boxMin = center.clone().addScaledVector(size, 0.5);
-                        var boxMax = center.clone().addScaledVector(size, -0.5);
-                        if (ray.intersectBox({
-                            min: boxMin,
-                            max: boxMax
-                        }, intersectPoint)) {
-                            success = true;
-                            hitPositions.push(intersectPoint);
-                        }
-                    } else if (hitParams.type === exports.HitTestType.sphere) {
-                        var center1 = hitParams.center, radius = hitParams.radius;
-                        if (ray.intersectSphere({
-                            center: center1,
-                            radius: radius
-                        }, intersectPoint)) {
-                            success = true;
-                            hitPositions.push(intersectPoint);
-                        }
-                    } else if (hitParams.type === exports.HitTestType.custom) {
-                        var tempPosition = hitParams.collect(ray, new Vector2(x, y));
-                        if (tempPosition && tempPosition.length > 0) {
-                            tempPosition.forEach(function(pos) {
-                                hitPositions.push(pos);
-                            });
-                            success = true;
-                        }
-                    }
-                    if (success) {
-                        var region = {
-                            compContent: _this.item,
-                            id: item.id,
-                            name: item.name,
-                            position: hitPositions[hitPositions.length - 1],
-                            parentId: item.parentId,
-                            hitPositions: hitPositions,
-                            behavior: hitParams.behavior
-                        };
-                        regions.push(region);
-                        if (stop(region)) {
-                            return {
-                                v: regions
-                            };
-                        }
-                    }
-                }
+    /**
+   * 处理蒙版和遮挡关系写入 stencil 的 ref 值
+   */ _proto.processMask = function processMask(renderer) {
+        var maskMode = renderer.maskMode;
+        if (maskMode === MaskMode.NONE) {
+            return;
+        }
+        if (!renderer.mask) {
+            if (maskMode === MaskMode.MASK) {
+                renderer.mask = ++this.mask;
+            } else if (maskMode === MaskMode.OBSCURED || maskMode === MaskMode.REVERSE_OBSCURED) {
+                renderer.mask = this.mask;
             }
-        };
-        var hitPositions = [];
-        var stop = (options == null ? void 0 : options.stop) || noop;
-        var skip = (options == null ? void 0 : options.skip) || noop;
-        var maxCount = (options == null ? void 0 : options.maxCount) || this.items.length;
-        for(var i = 0; i < this.items.length && regions.length < maxCount; i++){
-            var _ret = (_this = this, _loop(i));
-            if (_type_of(_ret) === "object") return _ret.v;
         }
-        return regions;
     };
-    _proto.fromData = function fromData(data) {
-    // this.timelineAsset = data.timelineAsset;
+    _proto.dispose = function dispose() {
+        this.textures = [];
+        this.composition = undefined;
+        this.jsonScene = undefined;
+        this.totalTime = 0;
+        this.pluginSystem = undefined;
+        this.sourceContent = undefined;
+        this.refCompositions.clear();
+        this.refCompositionProps.clear();
     };
-    return CompositionComponent;
-}(ItemBehaviour);
+    return CompositionSourceManager;
+}();
 
 /**
  * 合成抽象类：核心对象，通常一个场景只包含一个合成，可能会有多个合成。
  * 合成中包含了相关的 Item 元素，支持对 Item 元素的创建、更新和销毁。
  * 也负责 Item 相关的动画播放控制，和持有渲染帧数据。
  */ var Composition = /*#__PURE__*/ function() {
-    function Composition(props, scene, compositionSourceManager) {
+    function Composition(props, scene) {
         var _this = this;
-        this.compositionSourceManager = compositionSourceManager;
-        this./**
+        /**
    * 动画播放速度
-   */ speed = 1;
-        this.loaderData = {};
-        this.refContent = [];
-        this./**
+   */ this.speed = 1;
+        /**
+   * 用于保存与当前合成相关的插件数据
+   */ this.loaderData = {};
+        /**
+   * 预合成数组
+   */ this.refContent = [];
+        /**
    * 预合成的合成属性，在 content 中会被其元素属性覆盖
-   */ refCompositionProps = new Map();
+   */ this.refCompositionProps = new Map();
         this.editorScaleRatio = 1.0;
+        // TODO: 待优化
         this.assigned = false;
-        this.destroyed = false;
-        this.paused = false;
+        /**
+   * 销毁状态位
+   */ this.destroyed = false;
+        /**
+   * 合成暂停/播放 标识
+   */ this.paused = false;
         this.lastVideoUpdateTime = 0;
         this.postLoaders = [];
         var _props_reusable = props.reusable, reusable = _props_reusable === void 0 ? false : _props_reusable, _props_speed = props.speed, speed = _props_speed === void 0 ? 1 : _props_speed, _props_baseRenderOrder = props.baseRenderOrder, baseRenderOrder = _props_baseRenderOrder === void 0 ? 0 : _props_baseRenderOrder, renderer = props.renderer, onPlayerPause = props.onPlayerPause, onMessageItem = props.onMessageItem, onEnd = props.onEnd, event = props.event, width = props.width, height = props.height;
+        this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
         scene.jsonScene.imgUsage = undefined;
         if (reusable) {
             this.keepResource = true;
@@ -24153,19 +24403,12 @@ var tmpScale = new Vector3(1, 1, 1);
         assertExist(sourceContent);
         this.renderer = renderer;
         this.refCompositionProps = refCompositionProps;
-        var vfxItem = new exports.VFXItem(this.getEngine(), sourceContent);
-        vfxItem.name = "rootItem";
-        // TODO 编辑器数据传入 composition type 后移除
-        vfxItem.type = ItemType.composition;
-        vfxItem.composition = this;
-        this.rootComposition = vfxItem.addComponent(CompositionComponent);
+        this.rootItem = new exports.VFXItem(this.getEngine(), sourceContent);
+        this.rootItem.name = "rootItem";
+        this.rootItem.composition = this;
+        this.rootComposition = this.rootItem.addComponent(CompositionComponent);
         this.rootComposition.data = sourceContent;
         var imageUsage = !reusable && imgUsage;
-        this.transform = new Transform({
-            name: this.name
-        });
-        this.transform.engine = this.getEngine();
-        vfxItem.transform = this.transform;
         this.globalVolume = sourceContent.globalVolume;
         this.width = width;
         this.height = height;
@@ -24183,8 +24426,7 @@ var tmpScale = new Vector3(1, 1, 1);
         this.reusable = reusable;
         this.speed = speed;
         this.renderLevel = renderLevel;
-        this.autoRefTex = !this.keepResource && imageUsage && vfxItem.endBehavior !== ItemEndBehavior.loop;
-        this.rootItem = vfxItem;
+        this.autoRefTex = !this.keepResource && imageUsage && this.rootItem.endBehavior !== ItemEndBehavior.loop;
         this.name = sourceContent.name;
         this.pluginSystem = pluginSystem;
         this.pluginSystem.initializeComposition(this, scene);
@@ -24217,16 +24459,8 @@ var tmpScale = new Vector3(1, 1, 1);
     /**
    * 重新开始合成
    */ _proto.restart = function restart() {
-        // const contentItems = this.rootComposition.items;
-        // contentItems.forEach(item => item.dispose());
-        // contentItems.length = 0;
-        this.prepareRender();
         this.reset();
-        this.transform.setValid(true);
-        this.rootComposition.resetStatus();
         this.forwardTime(this.startTime);
-    // this.content.onUpdate(0);
-    // this.loaderData.spriteGroup.onUpdate(0);
     };
     /**
    * 设置当前合成的渲染顺序
@@ -24354,28 +24588,9 @@ var tmpScale = new Vector3(1, 1, 1);
     /**
    * 重置状态函数
    */ _proto.reset = function reset() {
-        var _this = this;
-        var vfxItem = new exports.VFXItem(this.getEngine(), this.compositionSourceManager.sourceContent);
-        // TODO 编辑器数据传入 composition type 后移除
-        vfxItem.type = ItemType.composition;
-        vfxItem.composition = this;
-        this.rootComposition = vfxItem.addComponent(CompositionComponent);
-        this.rootComposition.data = this.compositionSourceManager.sourceContent;
-        this.transform = new Transform({
-            name: this.name
-        });
-        this.transform.engine = this.getEngine();
-        vfxItem.transform = this.transform;
-        this.rootItem = vfxItem;
         this.rendererOptions = null;
         this.globalTime = 0;
-        this.rootComposition.createContent();
-        this.buildItemTree(this.rootItem);
-        this.rootItem.onEnd = function() {
-            window.setTimeout(function() {
-                _this.onEnd == null ? void 0 : _this.onEnd.call(_this, _this);
-            }, 0);
-        };
+        this.rootItem.ended = false;
         this.pluginSystem.resetComposition(this, this.renderFrame);
     };
     _proto.prepareRender = function prepareRender() {
@@ -24421,7 +24636,6 @@ var tmpScale = new Vector3(1, 1, 1);
         }
         var _this_rootItem = this.rootItem, ended = _this_rootItem.ended, endBehavior = _this_rootItem.endBehavior;
         // TODO: 合成结束行为
-        // @ts-expect-error
         return ended && (!endBehavior || endBehavior === END_BEHAVIOR_PAUSE_AND_DESTROY);
     };
     /**
@@ -24517,7 +24731,7 @@ var tmpScale = new Vector3(1, 1, 1);
             var child = _step2.value;
             if (exports.VFXItem.isComposition(child)) {
                 if (child.ended && child.endBehavior === ItemEndBehavior.loop) {
-                    child.getComponent(CompositionComponent).resetStatus();
+                    child.ended = false;
                     // TODO K帧动画在元素重建后需要 tick ，否则会导致元素位置和 k 帧第一帧位置不一致
                     this.callUpdate(child, 0);
                 } else {
@@ -24924,6 +25138,14 @@ var tmpScale = new Vector3(1, 1, 1);
         })();
     };
     _create_class(Composition, [
+        {
+            key: "transform",
+            get: /**
+   * 所有合成 Item 的根变换
+   */ function get() {
+                return this.rootItem.transform;
+            }
+        },
         {
             key: "textures",
             get: /**
@@ -24969,189 +25191,6 @@ var tmpScale = new Vector3(1, 1, 1);
     return Composition;
 }();
 
-var listOrder = 0;
-/**
- * 合成资源管理
- */ var CompositionSourceManager = /*#__PURE__*/ function() {
-    function CompositionSourceManager(scene, engine) {
-        this.refCompositions = new Map();
-        this.refCompositionProps = new Map();
-        this.mask = 0;
-        this.engine = engine;
-        // 资源
-        var jsonScene = scene.jsonScene, renderLevel = scene.renderLevel, textureOptions = scene.textureOptions, pluginSystem = scene.pluginSystem, totalTime = scene.totalTime;
-        var compositions = jsonScene.compositions, imgUsage = jsonScene.imgUsage, compositionId = jsonScene.compositionId;
-        if (!textureOptions) {
-            throw new Error("scene.textures expected");
-        }
-        var cachedTextures = textureOptions;
-        for(var _iterator = _create_for_of_iterator_helper_loose(compositions), _step; !(_step = _iterator()).done;){
-            var comp = _step.value;
-            if (comp.id === compositionId) {
-                this.composition = comp;
-            } else {
-                this.refCompositions.set(comp.id, comp);
-            }
-        }
-        if (!this.composition) {
-            throw new Error("Invalid composition id: " + compositionId);
-        }
-        this.jsonScene = jsonScene;
-        this.renderLevel = renderLevel;
-        this.pluginSystem = pluginSystem;
-        this.totalTime = totalTime != null ? totalTime : 0;
-        this.imgUsage = imgUsage != null ? imgUsage : {};
-        this.textures = cachedTextures;
-        listOrder = 0;
-        this.sourceContent = this.getContent(this.composition);
-    }
-    var _proto = CompositionSourceManager.prototype;
-    _proto.getContent = function getContent(composition) {
-        // TODO: specification 中补充 globalVolume 类型
-        // @ts-expect-error
-        var id = composition.id, duration = composition.duration, name = composition.name, endBehavior = composition.endBehavior, camera = composition.camera, globalVolume = composition.globalVolume, _composition_startTime = composition.startTime, startTime = _composition_startTime === void 0 ? 0 : _composition_startTime, timelineAsset = composition.timelineAsset;
-        var items = this.assembleItems(composition);
-        //@ts-expect-error
-        if (!composition.sceneBindings) {
-            //@ts-expect-error
-            composition.sceneBindings = [];
-        }
-        return {
-            id: id,
-            duration: duration,
-            name: name,
-            endBehavior: isNaN(endBehavior) ? END_BEHAVIOR_PAUSE : endBehavior,
-            // looping,
-            items: items,
-            camera: camera,
-            startTime: startTime,
-            globalVolume: globalVolume,
-            timelineAsset: timelineAsset,
-            //@ts-expect-error
-            sceneBindings: composition.sceneBindings
-        };
-    };
-    _proto.assembleItems = function assembleItems(composition) {
-        var _this = this;
-        var items = [];
-        this.mask++;
-        var componentMap = {};
-        //@ts-expect-error
-        for(var _iterator = _create_for_of_iterator_helper_loose(this.jsonScene.components), _step; !(_step = _iterator()).done;){
-            var component = _step.value;
-            componentMap[component.id] = component;
-        }
-        for(var _iterator1 = _create_for_of_iterator_helper_loose(composition.items), _step1; !(_step1 = _iterator1()).done;){
-            var itemDataPath = _step1.value;
-            //@ts-expect-error
-            var sourceItemData = this.engine.jsonSceneData[itemDataPath.id];
-            var itemProps = sourceItemData;
-            if (passRenderLevel(sourceItemData.renderLevel, this.renderLevel)) {
-                if (itemProps.type === ItemType.sprite || itemProps.type === ItemType.particle) {
-                    for(var _iterator2 = _create_for_of_iterator_helper_loose(itemProps.components), _step2; !(_step2 = _iterator2()).done;){
-                        var componentPath = _step2.value;
-                        var componentData = componentMap[componentPath.id];
-                        this.preProcessItemContent(componentData);
-                    }
-                } else {
-                    var renderContent = itemProps.content;
-                    if (renderContent) {
-                        this.preProcessItemContent(renderContent);
-                    }
-                }
-                itemProps.listIndex = listOrder++;
-                // 处理预合成的渲染顺序
-                if (itemProps.type === ItemType.composition) {
-                    var refId = sourceItemData.content.options.refId;
-                    if (!this.refCompositions.get(refId)) {
-                        throw new Error("Invalid Ref Composition id: " + refId);
-                    }
-                    var ref = this.getContent(this.refCompositions.get(refId));
-                    if (!this.refCompositionProps.has(refId)) {
-                        this.refCompositionProps.set(refId, ref);
-                    }
-                    ref.items.forEach(function(item) {
-                        _this.processMask(item.content);
-                    });
-                    itemProps.items = ref.items;
-                }
-                items.push(itemProps);
-            }
-        }
-        return items;
-    };
-    _proto.preProcessItemContent = function preProcessItemContent(renderContent) {
-        if (renderContent.renderer) {
-            renderContent.renderer = this.changeTex(renderContent.renderer);
-            if (!renderContent.renderer.mask) {
-                this.processMask(renderContent.renderer);
-            }
-            var split = renderContent.splits && !renderContent.textureSheetAnimation && renderContent.splits[0];
-            if (Number.isInteger(renderContent.renderer.shape)) {
-                var _this_jsonScene;
-                // TODO: scene.shapes 类型问题？
-                renderContent.renderer.shape = getGeometryByShape((_this_jsonScene = this.jsonScene) == null ? void 0 : _this_jsonScene.shapes[renderContent.renderer.shape], split);
-            } else if (renderContent.renderer.shape && isObject(renderContent.renderer.shape)) {
-                renderContent.renderer.shape = getGeometryByShape(renderContent.renderer.shape, split);
-            }
-        }
-        if (renderContent.trails) {
-            renderContent.trails = this.changeTex(renderContent.trails);
-        }
-    };
-    _proto.changeTex = function changeTex(renderer) {
-        if (!renderer.texture) {
-            return renderer;
-        }
-        //@ts-expect-error
-        var texIdx = renderer.texture.id;
-        if (texIdx !== undefined) {
-            //@ts-expect-error
-            this.addTextureUsage(texIdx) || texIdx;
-        }
-        return renderer;
-    };
-    _proto.addTextureUsage = function addTextureUsage(texIdx) {
-        var texId = texIdx;
-        var _this_imgUsage;
-        // FIXME: imageUsage 取自 scene.imgUsage，类型为 Record<string, number[]>，这里给的 number，类型对不上
-        var imageUsage = (_this_imgUsage = this.imgUsage) != null ? _this_imgUsage : {};
-        if (texId && imageUsage) {
-            // eslint-disable-next-line no-prototype-builtins
-            if (!imageUsage.hasOwnProperty(texId)) {
-                imageUsage[texId] = 0;
-            }
-            imageUsage[texId]++;
-        }
-    };
-    /**
-   * 处理蒙版和遮挡关系写入 stencil 的 ref 值
-   */ _proto.processMask = function processMask(renderer) {
-        var maskMode = renderer.maskMode;
-        if (maskMode === MaskMode.NONE) {
-            return;
-        }
-        if (!renderer.mask) {
-            if (maskMode === MaskMode.MASK) {
-                renderer.mask = ++this.mask;
-            } else if (maskMode === MaskMode.OBSCURED || maskMode === MaskMode.REVERSE_OBSCURED) {
-                renderer.mask = this.mask;
-            }
-        }
-    };
-    _proto.dispose = function dispose() {
-        this.textures = [];
-        this.composition = undefined;
-        this.jsonScene = undefined;
-        this.totalTime = 0;
-        this.pluginSystem = undefined;
-        this.sourceContent = undefined;
-        this.refCompositions.clear();
-        this.refCompositionProps.clear();
-    };
-    return CompositionSourceManager;
-}();
-
 /**
  * Engine 基类，负责维护所有 GPU 资源的管理及销毁
  */ var Engine = /*#__PURE__*/ function() {
@@ -25192,61 +25231,46 @@ var listOrder = 0;
         delete this.objectInstance[id];
     };
     _proto.addPackageDatas = function addPackageDatas(scene) {
-        var jsonScene = scene.jsonScene;
-        if (jsonScene.items) {
-            for(var _iterator = _create_for_of_iterator_helper_loose(jsonScene.items), _step; !(_step = _iterator()).done;){
-                var vfxItemData = _step.value;
-                this.addEffectsObjectData(vfxItemData);
-            }
-        }
-        if (jsonScene.materials) {
-            for(var _iterator1 = _create_for_of_iterator_helper_loose(jsonScene.materials), _step1; !(_step1 = _iterator1()).done;){
-                var materialData = _step1.value;
-                this.addEffectsObjectData(materialData);
-            }
-        }
-        if (jsonScene.shaders) {
-            for(var _iterator2 = _create_for_of_iterator_helper_loose(jsonScene.shaders), _step2; !(_step2 = _iterator2()).done;){
-                var shaderData = _step2.value;
-                this.addEffectsObjectData(shaderData);
-            }
-        }
-        if (jsonScene.geometries) {
-            for(var _iterator3 = _create_for_of_iterator_helper_loose(jsonScene.geometries), _step3; !(_step3 = _iterator3()).done;){
-                var geometryData = _step3.value;
-                this.addEffectsObjectData(geometryData);
-            }
-        }
-        if (jsonScene.components) {
-            for(var _iterator4 = _create_for_of_iterator_helper_loose(jsonScene.components), _step4; !(_step4 = _iterator4()).done;){
-                var componentData = _step4.value;
-                this.addEffectsObjectData(componentData);
-            }
-        }
-        if (jsonScene.animations) {
-            for(var _iterator5 = _create_for_of_iterator_helper_loose(jsonScene.animations), _step5; !(_step5 = _iterator5()).done;){
-                var animationData = _step5.value;
-                this.addEffectsObjectData(animationData);
-            }
-        }
-        if (jsonScene.bins) {
-            for(var i = 0; i < jsonScene.bins.length; i++){
-                var binaryData = jsonScene.bins[i];
-                var binaryBuffer = scene.bins[i];
-                //@ts-expect-error
-                binaryData.buffer = binaryBuffer;
+        var jsonScene = scene.jsonScene, _scene_textureOptions = scene.textureOptions, textureOptions = _scene_textureOptions === void 0 ? [] : _scene_textureOptions;
+        var _jsonScene_items = jsonScene.items, items = _jsonScene_items === void 0 ? [] : _jsonScene_items, _jsonScene_materials = jsonScene.materials, materials = _jsonScene_materials === void 0 ? [] : _jsonScene_materials, _jsonScene_shaders = jsonScene.shaders, shaders = _jsonScene_shaders === void 0 ? [] : _jsonScene_shaders, _jsonScene_geometries = jsonScene.geometries, geometries = _jsonScene_geometries === void 0 ? [] : _jsonScene_geometries, _jsonScene_components = jsonScene.components, components = _jsonScene_components === void 0 ? [] : _jsonScene_components, _jsonScene_animations = jsonScene.animations, animations = _jsonScene_animations === void 0 ? [] : _jsonScene_animations, _jsonScene_bins = jsonScene.bins, bins = _jsonScene_bins === void 0 ? [] : _jsonScene_bins;
+        for(var _iterator = _create_for_of_iterator_helper_loose(items), _step; !(_step = _iterator()).done;){
+            var vfxItemData = _step.value;
+            this.addEffectsObjectData(vfxItemData);
+        }
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(materials), _step1; !(_step1 = _iterator1()).done;){
+            var materialData = _step1.value;
+            this.addEffectsObjectData(materialData);
+        }
+        for(var _iterator2 = _create_for_of_iterator_helper_loose(shaders), _step2; !(_step2 = _iterator2()).done;){
+            var shaderData = _step2.value;
+            this.addEffectsObjectData(shaderData);
+        }
+        for(var _iterator3 = _create_for_of_iterator_helper_loose(geometries), _step3; !(_step3 = _iterator3()).done;){
+            var geometryData = _step3.value;
+            this.addEffectsObjectData(geometryData);
+        }
+        for(var _iterator4 = _create_for_of_iterator_helper_loose(components), _step4; !(_step4 = _iterator4()).done;){
+            var componentData = _step4.value;
+            this.addEffectsObjectData(componentData);
+        }
+        for(var _iterator5 = _create_for_of_iterator_helper_loose(animations), _step5; !(_step5 = _iterator5()).done;){
+            var animationData = _step5.value;
+            this.addEffectsObjectData(animationData);
+        }
+        for(var i = 0; i < bins.length; i++){
+            var binaryData = bins[i];
+            var binaryBuffer = scene.bins[i];
+            //@ts-expect-error
+            binaryData.buffer = binaryBuffer;
+            //@ts-expect-error
+            if (binaryData.id) {
                 //@ts-expect-error
-                if (binaryData.id) {
-                    //@ts-expect-error
-                    this.addEffectsObjectData(binaryData);
-                }
+                this.addEffectsObjectData(binaryData);
             }
         }
-        if (scene.textureOptions) {
-            for(var _iterator6 = _create_for_of_iterator_helper_loose(scene.textureOptions), _step6; !(_step6 = _iterator6()).done;){
-                var textureData = _step6.value;
-                this.addEffectsObjectData(textureData);
-            }
+        for(var _iterator6 = _create_for_of_iterator_helper_loose(textureOptions), _step6; !(_step6 = _iterator6()).done;){
+            var textureData = _step6.value;
+            this.addEffectsObjectData(textureData);
         }
     };
     _proto.createVFXItems = function createVFXItems(scene) {
@@ -25266,9 +25290,7 @@ var listOrder = 0;
                         ];
                         itemData = _step.value;
                         itemType = itemData.type;
-                        if (!// @ts-expect-error
-                        (itemType === "ECS" || // @ts-expect-error
-                        itemType === "camera" || itemType === ItemType.sprite || itemType === ItemType.particle || itemType === ItemType.mesh || itemType === ItemType.skybox || itemType === ItemType.light || itemType === ItemType.tree || itemType === ItemType.interact || itemType === ItemType.camera)) {
+                        if (!(itemType === "ECS" || itemType === "camera" || itemType === ItemType.sprite || itemType === ItemType.particle || itemType === ItemType.mesh || itemType === ItemType.skybox || itemType === ItemType.light || itemType === ItemType.tree || itemType === ItemType.interact || itemType === ItemType.camera)) {
                             return [
                                 3,
                                 3
@@ -25385,19 +25407,19 @@ var listOrder = 0;
             logger.warn("Release GPU memory: " + info.join(", "));
         }
         this.renderPasses.forEach(function(pass) {
-            pass.dispose();
+            return pass.dispose();
         });
         this.meshes.forEach(function(mesh) {
-            mesh.dispose();
+            return mesh.dispose();
         });
         this.geometries.forEach(function(geo) {
-            geo.dispose();
+            return geo.dispose();
         });
         this.materials.forEach(function(mat) {
-            mat.dispose();
+            return mat.dispose();
         });
         this.textures.forEach(function(tex) {
-            tex.dispose();
+            return tex.dispose();
         });
         this.textures = [];
         this.materials = [];
@@ -26710,11 +26732,8 @@ var seed = 1;
  * composition 抽象类的实现
  */ var ThreeComposition = /*#__PURE__*/ function(Composition) {
     _inherits(ThreeComposition, Composition);
-    function ThreeComposition(props, scene, compositionSourceManager) {
-        var _this;
-        _this = Composition.call(this, props, scene, compositionSourceManager) || this;
-        _this.rootItem.getComponent(CompositionComponent).resetStatus();
-        return _this;
+    function ThreeComposition(props, scene) {
+        return Composition.call(this, props, scene);
     }
     var _proto = ThreeComposition.prototype;
     /**
@@ -26906,7 +26925,7 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
         if (options === void 0) options = {};
         var _this = this;
         return _async_to_generator(function() {
-            var last, opts, source, scene, engine, i, compositionSourceManager, composition, firstFrameTime;
+            var last, opts, source, scene, engine, i, composition, firstFrameTime;
             return __generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
@@ -26943,7 +26962,6 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
                             scene.textureOptions[i] = engine.assetLoader.loadGUID(scene.textureOptions[i].id);
                             scene.textureOptions[i].initialize();
                         }
-                        compositionSourceManager = new CompositionSourceManager(scene, engine);
                         if (!engine.database) return [
                             3,
                             3
@@ -26960,7 +26978,7 @@ var ThreeRenderer = /*#__PURE__*/ function(Renderer) {
                             width: _this.width,
                             height: _this.height,
                             renderer: _this.renderer
-                        }), scene, compositionSourceManager);
+                        }), scene);
                         _this.renderer.engine.setOptions({
                             threeCamera: _this.camera,
                             threeGroup: _this,
@@ -27139,12 +27157,11 @@ setMaxSpriteMeshItemCount(8);
  */ Mesh.create = function(engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.0.0-alpha.13";
+var version = "2.0.0-alpha.15";
 logger.info("THREEJS plugin version: " + version);
 
 exports.AbstractPlugin = AbstractPlugin;
 exports.ActivationPlayable = ActivationPlayable;
-exports.ActivationPlayableAsset = ActivationPlayableAsset;
 exports.AnimationClipPlayable = AnimationClipPlayable;
 exports.AssetLoader = AssetLoader;
 exports.AssetManager = AssetManager;
@@ -27252,6 +27269,7 @@ exports.addItem = addItem;
 exports.addItemWithOrder = addItemWithOrder;
 exports.assertExist = assertExist;
 exports.asserts = asserts;
+exports.base64ToFile = base64ToFile;
 exports.blend = blend;
 exports.calculateTranslation = calculateTranslation;
 exports.canvasPool = canvasPool;
@@ -27320,6 +27338,7 @@ exports.interpolateColor = interpolateColor;
 exports.isAlipayMiniApp = isAlipayMiniApp;
 exports.isAndroid = isAndroid;
 exports.isArray = isArray;
+exports.isCanvas = isCanvas;
 exports.isFunction = isFunction;
 exports.isIOS = isIOS;
 exports.isObject = isObject;