@galacean/effects-core 2.0.0-alpha.14 → 2.0.0-alpha.16

package/dist/index.js

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime core for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.0.0-alpha.14
+ * Version: v2.0.0-alpha.16
  */
 
 'use strict';
@@ -597,6 +597,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);
@@ -624,6 +629,35 @@ function throwDestroyedError() {
 function generateGUID() {
     return v4().replace(/-/g, '');
 }
+function base64ToFile(base64, filename = 'base64File', contentType = '') {
+    // 去掉 Base64 字符串的 Data URL 部分（如果存在）
+    const base64WithoutPrefix = base64.split(',')[1] || base64;
+    // 将 base64 编码的字符串转换为二进制字符串
+    const byteCharacters = atob(base64WithoutPrefix);
+    // 创建一个 8 位无符号整数值的数组，即“字节数组”
+    const byteArrays = [];
+    // 切割二进制字符串为多个片段，并将每个片段转换成一个字节数组
+    for(let offset = 0; offset < byteCharacters.length; offset += 512){
+        const slice = byteCharacters.slice(offset, offset + 512);
+        const byteNumbers = new Array(slice.length);
+        for(let i = 0; i < slice.length; i++){
+            byteNumbers[i] = slice.charCodeAt(i);
+        }
+        const byteArray = new Uint8Array(byteNumbers);
+        byteArrays.push(byteArray);
+    }
+    // 使用字节数组创建 Blob 对象
+    const blob = new Blob(byteArrays, {
+        type: contentType
+    });
+    // 创建 File 对象
+    const file = new File([
+        blob
+    ], filename, {
+        type: contentType
+    });
+    return file;
+}
 
 function __decorate(decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -12744,13 +12778,16 @@ const tempColor = [
 let seed$3 = 0;
 class SpriteColorPlayable extends Playable {
     processFrame(context) {
-        const boundItem = context.output.getUserData();
+        const boundObject = context.output.getUserData();
+        if (!(boundObject instanceof VFXItem)) {
+            return;
+        }
         if (!this.spriteMaterial) {
-            this.spriteMaterial = boundItem.getComponent(SpriteComponent).material;
+            this.spriteMaterial = boundObject.getComponent(SpriteComponent).material;
         }
         let colorInc = vecFill(tempColor, 1);
         let colorChanged;
-        const life = this.time / boundItem.duration;
+        const life = this.time / boundObject.duration;
         const opacityOverLifetime = this.opacityOverLifetime;
         const colorOverLifetime = this.colorOverLifetime;
         if (colorOverLifetime) {
@@ -12849,7 +12886,6 @@ class SpriteComponent extends RendererComponent {
         renderer.drawGeometry(geo, material);
     }
     start() {
-        this.priority = this.item.listIndex;
         this.item.getHitTestParams = this.getHitTestParams;
     }
     update(dt) {
@@ -15218,7 +15254,7 @@ function getTrailMeshShader(trails, particleMaxCount, name, env = '', gpuCapabil
  * @internal
  */ class ParticleSystemRenderer extends RendererComponent {
     start() {
-        this._priority = this.item.listIndex;
+        this._priority = this.item.renderOrder;
         this.particleMesh.gravityModifier.scaleXCoord(this.item.duration);
         for (const mesh of this.meshes){
             mesh.start();
@@ -16248,13 +16284,13 @@ function randomArrItem(arr, keepArr) {
  * @internal
  */ class ParticleBehaviourPlayable extends Playable {
     start(context) {
-        const binding = context.output.getUserData();
-        if (this.particleSystem) {
+        const boundObject = context.output.getUserData();
+        if (this.particleSystem || !(boundObject instanceof VFXItem)) {
             return;
         }
-        this.particleSystem = binding.getComponent(ParticleSystem);
+        this.particleSystem = boundObject.getComponent(ParticleSystem);
         if (this.particleSystem) {
-            this.particleSystem.name = binding.name;
+            this.particleSystem.name = boundObject.name;
             this.particleSystem.start();
             this.particleSystem.initEmitterTransform();
         }
@@ -17374,10 +17410,13 @@ const tempPos = new Vector3();
     }
     processFrame(context) {
         if (!this.binding) {
-            this.binding = context.output.getUserData();
-            this.start();
+            const boundObject = context.output.getUserData();
+            if (boundObject instanceof VFXItem) {
+                this.binding = boundObject;
+                this.start();
+            }
         }
-        if (this.binding.composition) {
+        if (this.binding && this.binding.composition) {
             this.sampleAnimation();
         }
     }
@@ -17545,24 +17584,26 @@ AnimationClip = __decorate([
 ], AnimationClip);
 class AnimationClipPlayable extends Playable {
     processFrame(context) {
-        const boundItem = context.output.getUserData();
-        if (boundItem.composition) {
-            this.clip.sampleAnimation(boundItem, this.time);
+        const boundObject = context.output.getUserData();
+        if (!(boundObject instanceof VFXItem)) {
+            return;
+        }
+        if (boundObject.composition) {
+            this.clip.sampleAnimation(boundObject, this.time);
         }
     }
 }
 
 class TrackAsset extends PlayableAsset {
-    initializeBinding(parentBinding) {
-        this.binding = parentBinding;
+    /**
+   * 重写该方法以获取自定义对象绑定
+   */ resolveBinding(parentBinding) {
+        return parentBinding;
     }
     /**
-   * @internal
-   */ initializeBindingRecursive(parentBinding) {
-        this.initializeBinding(parentBinding);
-        for (const subTrack of this.children){
-            subTrack.initializeBindingRecursive(this.binding);
-        }
+   * 重写该方法以创建自定义混合器
+   */ createTrackMixer(graph) {
+        return new Playable(graph);
     }
     createOutput() {
         const output = new PlayableOutput();
@@ -17591,11 +17632,6 @@ class TrackAsset extends PlayableAsset {
         }
         return mixer;
     }
-    /**
-   * 重写该方法以创建自定义混合器
-   */ createTrackMixer(graph) {
-        return new Playable(graph);
-    }
     createPlayable(graph) {
         return new Playable(graph);
     }
@@ -17736,13 +17772,6 @@ class RuntimeClip {
 class ObjectBindingTrack extends TrackAsset {
     create(timelineAsset) {
         const boundItem = this.binding;
-        this.options = {
-            start: boundItem.start,
-            duration: boundItem.duration,
-            looping: boundItem.endBehavior === ItemEndBehavior.loop,
-            endBehavior: boundItem.endBehavior || ItemEndBehavior.destroy
-        };
-        this.name = boundItem.name;
         // 添加粒子动画 clip
         if (boundItem.getComponent(ParticleSystem)) {
             const particleTrack = timelineAsset.createTrack(TrackAsset, this, 'ParticleTrack');
@@ -17753,18 +17782,6 @@ class ObjectBindingTrack extends TrackAsset {
             particleClip.endBehaviour = boundItem.endBehavior;
         }
     }
-    toLocalTime(time) {
-        let localTime = time - this.options.start;
-        const 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;
-    }
     fromData(data) {
         super.fromData(data);
         this.data = data;
@@ -17782,13 +17799,11 @@ TransformTrack = __decorate([
 
 class ActivationMixerPlayable extends Playable {
     processFrame(context) {
-        if (!this.bindingItem) {
-            this.bindingItem = context.output.getUserData();
-        }
-        if (!this.bindingItem) {
+        const boundObject = context.output.getUserData();
+        if (!(boundObject instanceof VFXItem)) {
             return;
         }
-        const bindingItem = this.bindingItem;
+        const boundItem = boundObject;
         let hasInput = false;
         for(let i = 0; i < this.getInputCount(); i++){
             if (this.getInputWeight(i) > 0) {
@@ -17797,11 +17812,11 @@ class ActivationMixerPlayable extends Playable {
             }
         }
         if (hasInput) {
-            bindingItem.transform.setValid(true);
-            this.showRendererComponents(bindingItem);
+            boundItem.transform.setValid(true);
+            this.showRendererComponents(boundItem);
         } else {
-            bindingItem.transform.setValid(false);
-            this.hideRendererComponents(bindingItem);
+            boundItem.transform.setValid(false);
+            this.hideRendererComponents(boundItem);
         }
     }
     hideRendererComponents(item) {
@@ -17821,9 +17836,6 @@ class ActivationMixerPlayable extends Playable {
 }
 
 class ActivationTrack extends TrackAsset {
-    initializeBinding(parentBinding) {
-        this.binding = parentBinding;
-    }
     createTrackMixer(graph) {
         return new ActivationMixerPlayable(graph);
     }
@@ -17840,7 +17852,6 @@ SpriteColorTrack = __decorate([
 
 class TimelineAsset extends PlayableAsset {
     createPlayable(graph) {
-        this.graph = graph;
         const timelinePlayable = new TimelinePlayable(graph);
         timelinePlayable.setTraversalMode(PlayableTraversalMode.Passthrough);
         for (const track of this.tracks){
@@ -17951,179 +17962,415 @@ function compareTracks(a, b) {
     }
 }
 
-class TextLayout {
-    getOffsetY(style) {
-        let offsetY = 0;
-        const 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;
+/**
+ * @since 2.0.0
+ * @internal
+ */ class CompositionComponent extends ItemBehaviour {
+    start() {
+        const { startTime = 0 } = this.item.props;
+        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;
     }
-    getOffsetX(style, maxWidth) {
-        let 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;
+    setReusable(value) {
+        for (const track of this.timelineAsset.tracks){
+            const binding = track.binding;
+            if (binding instanceof VFXItem) {
+                if (track instanceof ObjectBindingTrack) {
+                    binding.reusable = value;
+                }
+                const subCompositionComponent = binding.getComponent(CompositionComponent);
+                if (subCompositionComponent) {
+                    subCompositionComponent.setReusable(value);
+                }
+            }
         }
-        return offsetX;
-    }
-    /**
-   * 设置文本框的宽度和高度
-   * @param width 文本框宽度
-   * @param height 文本框高度
-   */ setSize(width, height) {
-        this.width = width;
-        this.height = height;
     }
-    constructor(options){
-        this.width = 0;
-        this.height = 0;
-        const { textHeight = 100, textWidth = 100, textOverflow = TextOverflow.display, textBaseline = TextBaseline.top, textAlign = TextAlignment.left, text, letterSpace = 0, autoWidth = false, fontSize, lineHeight = fontSize } = options;
-        const 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;
+    getReusable() {
+        return this.reusable;
     }
-}
-
-class TextStyle {
-    constructor(options){
-        /**
-   * 是否有下划线（暂时无效）
-   */ this.isUnderline = false // ttf
-        ;
-        /**
-   * 下划线高度（暂时无效）
-   */ this.underlineHeight = 1 // ttf
-        ;
-        /**
-   * 是否有外描边
-   */ this.isOutlined = false // both // ttf & char
-        ;
-        /**
-   * 外描边宽度
-   */ this.outlineWidth = 0 // both // ttf & char
-        ;
-        /**
-   * 是否有阴影
-   */ this.hasShadow = false // ttf
-        ;
-        this.fontDesc = '' // both
-        ;
-        /**
-   * 字体倍数
-   */ this.fontScale = 2;
-        this.fontOffset = 0;
-        const { textColor = [
-            1,
-            1,
-            1,
-            1
-        ], fontSize = 40, outline, shadow, fontWeight = 'normal', fontStyle = 'normal', fontFamily = 'sans-serif' } = options;
-        this.textColor = textColor;
-        //@ts-expect-error
-        this.textWeight = fontWeight;
-        //@ts-expect-error
-        this.fontStyle = fontStyle;
-        this.fontFamily = fontFamily;
-        this.fontSize = fontSize; // 暂时取消字号限制 Math.min(fontSize, this.maxFontSize);
-        if (outline) {
-            this.isOutlined = true;
-            var _outline_outlineColor;
-            this.outlineColor = (_outline_outlineColor = outline.outlineColor) != null ? _outline_outlineColor : [
-                1,
-                1,
-                1,
-                1
-            ];
-            var _outline_outlineWidth;
-            this.outlineWidth = (_outline_outlineWidth = outline.outlineWidth) != null ? _outline_outlineWidth : 1;
-            this.fontOffset += this.outlineWidth;
-        }
-        if (shadow) {
-            this.hasShadow = true;
-            var _shadow_shadowBlur;
-            this.shadowBlur = (_shadow_shadowBlur = shadow.shadowBlur) != null ? _shadow_shadowBlur : 2;
-            var _shadow_shadowColor;
-            this.shadowColor = (_shadow_shadowColor = shadow.shadowColor) != null ? _shadow_shadowColor : [
-                0,
-                0,
-                0,
-                1
-            ];
-            var _shadow_shadowOffsetX;
-            this.shadowOffsetX = (_shadow_shadowOffsetX = shadow.shadowOffsetX) != null ? _shadow_shadowOffsetX : 0;
-            var _shadow_shadowOffsetY;
-            this.shadowOffsetY = (_shadow_shadowOffsetY = shadow.shadowOffsetY) != null ? _shadow_shadowOffsetY : 0;
-        }
-        if (this.fontStyle !== FontStyle.normal) {
-            // 0.0174532925 = 3.141592653 / 180
-            this.fontOffset += this.fontSize * Math.tan(12 * 0.0174532925);
+    update(dt) {
+        const 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);
     }
-}
-
-class CanvasPool {
-    dispose() {
-        this.elements.forEach((e)=>e.remove());
-        // clearing the array
-        this.elements.length = 0;
-    }
-    getCanvas() {
-        if (this.elements.length !== 0) {
-            return this.elements.shift();
-        }
-        if (getConfig(TEMPLATE_USE_OFFSCREEN_CANVAS)) {
-            // @ts-expect-error
-            return window._createOffscreenCanvas(10, 10);
-        } else {
-            // in hongmeng system, create too many canvas will case render error
-            const defCanvas = document.createElement('canvas');
-            defCanvas.getContext('2d', {
-                willReadFrequently: true
+    createContent() {
+        const sceneBindings = [];
+        for (const sceneBindingData of this.data.sceneBindings){
+            sceneBindings.push({
+                key: this.engine.assetLoader.loadGUID(sceneBindingData.key.id),
+                value: this.engine.assetLoader.loadGUID(sceneBindingData.value.id)
             });
-            return defCanvas;
         }
-    }
-    saveCanvas(canvas) {
-        canvas.width = 1;
-        canvas.height = 1;
-        if (this.elements.length < 3) {
-            addItem(this.elements, canvas);
+        this.sceneBindings = sceneBindings;
+        const timelineAsset = this.data.timelineAsset ? this.engine.assetLoader.loadGUID(this.data.timelineAsset.id) : new TimelineAsset(this.engine);
+        this.timelineAsset = timelineAsset;
+        const items = this.items;
+        this.items.length = 0;
+        if (this.item.composition) {
+            const assetLoader = this.item.engine.assetLoader;
+            const itemProps = this.item.props.items ? this.item.props.items : [];
+            for(let i = 0; i < itemProps.length; i++){
+                let item;
+                const itemData = itemProps[i];
+                // 设置预合成作为元素时的时长、结束行为和渲染延时
+                if (exports.Item.isComposition(itemData)) {
+                    const refId = itemData.content.options.refId;
+                    const 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;
+                    const 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 (const vfxItem of compositionComponent.items){
+                        vfxItem.setInstanceId(generateGUID());
+                        for (const component of vfxItem.components){
+                            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 (VFXItem.isExtraCamera(item)) {
+                    this.item.composition.extraCamera = item;
+                }
+                items.push(item);
+            }
+        }
+    }
+    onDestroy() {
+        if (this.item.composition) {
+            if (this.items) {
+                this.items.forEach((item)=>item.dispose());
+                this.items.length = 0;
+            }
+        }
+    }
+    hitTest(ray, x, y, regions, force, options) {
+        const hitPositions = [];
+        const stop = (options == null ? void 0 : options.stop) || noop;
+        const skip = (options == null ? void 0 : options.skip) || noop;
+        const maxCount = (options == null ? void 0 : options.maxCount) || this.items.length;
+        for(let i = 0; i < this.items.length && regions.length < maxCount; i++){
+            const item = this.items[i];
+            if (item.getVisible() && !item.ended && !VFXItem.isComposition(item) && !skip(item)) {
+                const hitParams = item.getHitTestParams(force);
+                if (hitParams) {
+                    let success = false;
+                    const intersectPoint = new Vector3();
+                    if (hitParams.type === exports.HitTestType.triangle) {
+                        const { triangles, backfaceCulling } = hitParams;
+                        for(let j = 0; j < triangles.length; j++){
+                            const triangle = triangles[j];
+                            if (ray.intersectTriangle(triangle, intersectPoint, backfaceCulling)) {
+                                success = true;
+                                hitPositions.push(intersectPoint);
+                                break;
+                            }
+                        }
+                    } else if (hitParams.type === exports.HitTestType.box) {
+                        const { center, size } = hitParams;
+                        const boxMin = center.clone().addScaledVector(size, 0.5);
+                        const 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) {
+                        const { center, radius } = hitParams;
+                        if (ray.intersectSphere({
+                            center,
+                            radius
+                        }, intersectPoint)) {
+                            success = true;
+                            hitPositions.push(intersectPoint);
+                        }
+                    } else if (hitParams.type === exports.HitTestType.custom) {
+                        const tempPosition = hitParams.collect(ray, new Vector2(x, y));
+                        if (tempPosition && tempPosition.length > 0) {
+                            tempPosition.forEach((pos)=>{
+                                hitPositions.push(pos);
+                            });
+                            success = true;
+                        }
+                    }
+                    if (success) {
+                        const region = {
+                            compContent: this.item,
+                            id: item.id,
+                            name: item.name,
+                            position: hitPositions[hitPositions.length - 1],
+                            parentId: item.parentId,
+                            hitPositions,
+                            behavior: hitParams.behavior
+                        };
+                        regions.push(region);
+                        if (stop(region)) {
+                            return regions;
+                        }
+                    }
+                }
+            }
+        }
+        return regions;
+    }
+    fromData(data) {}
+    resolveBindings() {
+        for (const sceneBinding of this.sceneBindings){
+            sceneBinding.key.binding = sceneBinding.value;
+        }
+        for (const masterTrack of this.timelineAsset.tracks){
+            this.resolveTrackBindingsWithRoot(masterTrack);
+        }
+    }
+    resolveTrackBindingsWithRoot(track) {
+        for (const subTrack of track.getChildTracks()){
+            subTrack.binding = subTrack.resolveBinding(track.binding);
+            this.resolveTrackBindingsWithRoot(subTrack);
+        }
+    }
+    constructor(...args){
+        super(...args);
+        this.time = 0;
+        this.startTime = 0;
+        this.items = [] // 场景的所有元素
+        ;
+        this.reusable = false;
+        this.sceneBindings = [];
+        this.graph = new PlayableGraph();
+    }
+}
+
+class SubCompositionTrack extends TrackAsset {
+    resolveBinding(parentBinding) {
+        if (!(parentBinding instanceof VFXItem)) {
+            throw new Error('SubCompositionTrack needs to be set under the VFXItem track');
+        }
+        return parentBinding.getComponent(CompositionComponent);
+    }
+}
+SubCompositionTrack = __decorate([
+    effectsClass('SubCompositionTrack')
+], SubCompositionTrack);
+
+class SubCompositionClipPlayable extends Playable {
+    processFrame(context) {
+        const boundObject = context.output.getUserData();
+        if (boundObject instanceof CompositionComponent) {
+            boundObject.time = this.getTime();
+        }
+    }
+}
+
+class SubCompositionPlayableAsset extends PlayableAsset {
+    createPlayable(graph) {
+        return new SubCompositionClipPlayable(graph);
+    }
+}
+SubCompositionPlayableAsset = __decorate([
+    effectsClass('SubCompositionPlayableAsset')
+], SubCompositionPlayableAsset);
+
+class TextLayout {
+    getOffsetY(style) {
+        let offsetY = 0;
+        const 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;
+    }
+    getOffsetX(style, maxWidth) {
+        let 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 文本框高度
+   */ setSize(width, height) {
+        this.width = width;
+        this.height = height;
+    }
+    constructor(options){
+        this.width = 0;
+        this.height = 0;
+        const { textHeight = 100, textWidth = 100, textOverflow = TextOverflow.display, textBaseline = TextBaseline.top, textAlign = TextAlignment.left, text, letterSpace = 0, autoWidth = false, fontSize, lineHeight = fontSize } = options;
+        const 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;
+    }
+}
+
+class TextStyle {
+    constructor(options){
+        /**
+   * 是否有下划线（暂时无效）
+   */ this.isUnderline = false // ttf
+        ;
+        /**
+   * 下划线高度（暂时无效）
+   */ this.underlineHeight = 1 // ttf
+        ;
+        /**
+   * 是否有外描边
+   */ this.isOutlined = false // both // ttf & char
+        ;
+        /**
+   * 外描边宽度
+   */ this.outlineWidth = 0 // both // ttf & char
+        ;
+        /**
+   * 是否有阴影
+   */ this.hasShadow = false // ttf
+        ;
+        this.fontDesc = '' // both
+        ;
+        /**
+   * 字体倍数
+   */ this.fontScale = 2;
+        this.fontOffset = 0;
+        const { textColor = [
+            1,
+            1,
+            1,
+            1
+        ], fontSize = 40, outline, shadow, fontWeight = 'normal', fontStyle = 'normal', fontFamily = 'sans-serif' } = options;
+        this.textColor = textColor;
+        //@ts-expect-error
+        this.textWeight = fontWeight;
+        //@ts-expect-error
+        this.fontStyle = fontStyle;
+        this.fontFamily = fontFamily;
+        this.fontSize = fontSize; // 暂时取消字号限制 Math.min(fontSize, this.maxFontSize);
+        if (outline) {
+            this.isOutlined = true;
+            var _outline_outlineColor;
+            this.outlineColor = (_outline_outlineColor = outline.outlineColor) != null ? _outline_outlineColor : [
+                1,
+                1,
+                1,
+                1
+            ];
+            var _outline_outlineWidth;
+            this.outlineWidth = (_outline_outlineWidth = outline.outlineWidth) != null ? _outline_outlineWidth : 1;
+            this.fontOffset += this.outlineWidth;
+        }
+        if (shadow) {
+            this.hasShadow = true;
+            var _shadow_shadowBlur;
+            this.shadowBlur = (_shadow_shadowBlur = shadow.shadowBlur) != null ? _shadow_shadowBlur : 2;
+            var _shadow_shadowColor;
+            this.shadowColor = (_shadow_shadowColor = shadow.shadowColor) != null ? _shadow_shadowColor : [
+                0,
+                0,
+                0,
+                1
+            ];
+            var _shadow_shadowOffsetX;
+            this.shadowOffsetX = (_shadow_shadowOffsetX = shadow.shadowOffsetX) != null ? _shadow_shadowOffsetX : 0;
+            var _shadow_shadowOffsetY;
+            this.shadowOffsetY = (_shadow_shadowOffsetY = shadow.shadowOffsetY) != null ? _shadow_shadowOffsetY : 0;
+        }
+        if (this.fontStyle !== FontStyle.normal) {
+            // 0.0174532925 = 3.141592653 / 180
+            this.fontOffset += this.fontSize * Math.tan(12 * 0.0174532925);
+        }
+    }
+}
+
+class CanvasPool {
+    dispose() {
+        this.elements.forEach((e)=>e.remove());
+        // clearing the array
+        this.elements.length = 0;
+    }
+    getCanvas() {
+        if (this.elements.length !== 0) {
+            return this.elements.shift();
+        }
+        if (getConfig(TEMPLATE_USE_OFFSCREEN_CANVAS)) {
+            // @ts-expect-error
+            return window._createOffscreenCanvas(10, 10);
+        } else {
+            // in hongmeng system, create too many canvas will case render error
+            const defCanvas = document.createElement('canvas');
+            defCanvas.getContext('2d', {
+                willReadFrequently: true
+            });
+            return defCanvas;
+        }
+    }
+    saveCanvas(canvas) {
+        canvas.width = 1;
+        canvas.height = 1;
+        if (this.elements.length < 3) {
+            addItem(this.elements, canvas);
         } else {
             canvas.remove();
         }
@@ -18663,6 +18910,19 @@ class VFXItem extends EffectsObject {
         return (_this_composition_reusable = (_this_composition = this.composition) == null ? void 0 : _this_composition.reusable) != null ? _this_composition_reusable : false;
     }
     /**
+   * 元素在合成中的索引
+   */ get renderOrder() {
+        return this.listIndex;
+    }
+    set renderOrder(value) {
+        if (this.listIndex !== value) {
+            this.listIndex = value;
+            for (const rendererComponent of this.rendererComponents){
+                rendererComponent.priority = value;
+            }
+        }
+    }
+    /**
    * 设置元素的动画速度
    * @param speed - 速度
    */ setSpeed(speed) {
@@ -18919,7 +19179,7 @@ class VFXItem extends EffectsObject {
         this.parentId = parentId;
         this.duration = duration;
         this.endBehavior = endBehavior;
-        this.listIndex = listIndex;
+        this.renderOrder = listIndex;
         //@ts-expect-error
         this.oldId = data.oldId;
         if (!data.content) {
@@ -19387,14 +19647,16 @@ class SerializationHelper {
     static checkGLTFNode(value) {
         return value instanceof Object && value.nodeIndex !== undefined && value.isJoint !== undefined;
     }
+    static checkImageSource(value) {
+        return isCanvas(value) || value instanceof HTMLImageElement;
+    }
     static deserializeProperty(property, engine, level, type) {
         if (level > 14) {
             console.error('序列化数据的内嵌对象层数大于上限');
             return;
         }
-        if (typeof property === 'number' || typeof property === 'string' || typeof property === 'boolean') {
-            return property;
-        } else if (property instanceof Array) {
+        // 加载并链接 DataPath 字段表示的 EffectsObject 引用。Class 对象 copy [key, value] 会丢失对象信息，因此只递归数组对象和普通 js Object 结构对象。
+        if (property instanceof Array) {
             const res = [];
             for (const value of property){
                 res.push(SerializationHelper.deserializeProperty(value, engine, level + 1, type));
@@ -19403,9 +19665,7 @@ class SerializationHelper {
         // TODO json 数据避免传 typedArray
         } else if (SerializationHelper.checkDataPath(property)) {
             return engine.assetLoader.loadGUID(property.id);
-        } else if (property instanceof EffectsObject || SerializationHelper.checkTypedArray(property) || SerializationHelper.checkGLTFNode(property)) {
-            return property;
-        } else if (property instanceof Object) {
+        } else if (property instanceof Object && property.constructor === Object) {
             let res;
             if (type) {
                 const classConstructor = effectsClassStore[type];
@@ -19418,6 +19678,8 @@ class SerializationHelper {
                 res[key] = SerializationHelper.deserializeProperty(property[key], engine, level + 1);
             }
             return res;
+        } else {
+            return property;
         }
     }
     static deserializePropertyAsync(property, engine, level, type) {
@@ -19426,9 +19688,7 @@ class SerializationHelper {
                 console.error('序列化数据的内嵌对象层数大于上限');
                 return;
             }
-            if (typeof property === 'number' || typeof property === 'string' || typeof property === 'boolean') {
-                return property;
-            } else if (property instanceof Array) {
+            if (property instanceof Array) {
                 const res = [];
                 for (const value of property){
                     res.push((yield SerializationHelper.deserializePropertyAsync(value, engine, level + 1, type)));
@@ -19438,9 +19698,7 @@ class SerializationHelper {
             } else if (SerializationHelper.checkDataPath(property)) {
                 const res = yield engine.assetLoader.loadGUIDAsync(property.id);
                 return res;
-            } else if (property instanceof EffectsObject || SerializationHelper.checkTypedArray(property) || SerializationHelper.checkGLTFNode(property)) {
-                return property;
-            } else if (property instanceof Object) {
+            } else if (property instanceof Object && property.constructor === Object) {
                 let res;
                 if (type) {
                     const classConstructor = effectsClassStore[type];
@@ -19453,6 +19711,8 @@ class SerializationHelper {
                     res[key] = SerializationHelper.deserializeProperty(property[key], engine, level + 1);
                 }
                 return res;
+            } else {
+                return property;
             }
         })();
     }
@@ -19542,9 +19802,8 @@ class SerializationHelper {
                 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:
                 {
                     const classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
@@ -19592,9 +19851,8 @@ class SerializationHelper {
                     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:
                     {
                         const classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
@@ -20449,6 +20707,7 @@ function getStandardCameraContent(model) {
     _result;
     const result = _extends({}, json, {
         items: [],
+        compositions: [],
         components: [],
         materials: [],
         shaders: [],
@@ -20539,8 +20798,15 @@ function getStandardCameraContent(model) {
                 id: item.id
             };
         });
+        const compositionData = _extends({}, composition, {
+            timelineAsset: {
+                id: ''
+            },
+            sceneBindings: []
+        });
+        result.compositions.push(compositionData);
         // 生成时间轴数据
-        convertTimelineAsset(composition, guidToItemMap, result);
+        convertTimelineAsset(compositionData, guidToItemMap, result);
     }
     for (const item of result.items){
         // 原 texture 索引转为统一 guid 索引
@@ -20707,10 +20973,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();
@@ -20742,15 +21005,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;
@@ -20900,6 +21160,32 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
             });
             trackDatas.push(newTrackData);
         }
+        if (item.type === ItemType.composition) {
+            const newSubCompositionPlayableAssetData = {
+                id: generateGUID(),
+                dataType: 'SubCompositionPlayableAsset'
+            };
+            playableAssetDatas.push(newSubCompositionPlayableAssetData);
+            const newTrackData = {
+                id: generateGUID(),
+                dataType: 'SubCompositionTrack',
+                children: [],
+                clips: [
+                    {
+                        start: item.delay,
+                        duration: item.duration,
+                        endBehaviour: item.endBehavior,
+                        asset: {
+                            id: newSubCompositionPlayableAssetData.id
+                        }
+                    }
+                ]
+            };
+            subTrackDatas.push({
+                id: newTrackData.id
+            });
+            trackDatas.push(newTrackData);
+        }
         const bindingTrackData = {
             id: generateGUID(),
             dataType: 'ObjectBindingTrack',
@@ -20925,11 +21211,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 = [];
@@ -21247,7 +21531,17 @@ function getStandardItem(item, opt = {}) {
     }
 }
 
-const renderLevelPassSet = {
+/**
+ * 机型和渲染等级对应表
+ *
+ * 机型：B-低端机、A-中端机、S-高端机
+ * 渲染等级：B-低、A-中、S-高、A+-中高、B+-全部
+ *
+ * - S（高端机）：高、全部、中高
+ * - A（中端机）：中、全部、中高
+ * - B（低端机）：低、全部
+ * - undefined（全部机型）
+ */ const renderLevelPassSet = {
     [RenderLevel.S]: [
         RenderLevel.S,
         RenderLevel.BPlus,
@@ -21796,40 +22090,6 @@ function createTextureOptionsBySource(image, sourceFrom) {
     }
     throw new Error('Invalid texture options');
 }
-function base64ToFile(base64, filename = 'base64File', contentType = '') {
-    // 去掉 Base64 字符串的 Data URL 部分（如果存在）
-    const base64WithoutPrefix = base64.split(',')[1] || base64;
-    // 将 base64 编码的字符串转换为二进制字符串
-    const byteCharacters = atob(base64WithoutPrefix);
-    // 创建一个 8 位无符号整数值的数组，即“字节数组”
-    const byteArrays = [];
-    // 切割二进制字符串为多个片段，并将每个片段转换成一个字节数组
-    for(let offset = 0; offset < byteCharacters.length; offset += 512){
-        const slice = byteCharacters.slice(offset, offset + 512);
-        const byteNumbers = new Array(slice.length);
-        for(let i = 0; i < slice.length; i++){
-            byteNumbers[i] = slice.charCodeAt(i);
-        }
-        const byteArray = new Uint8Array(byteNumbers);
-        byteArrays.push(byteArray);
-    }
-    // 使用字节数组创建 Blob 对象
-    const blob = new Blob(byteArrays, {
-        type: contentType
-    });
-    // 创建 File 对象
-    const 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';
-}
 
 const tmpScale = new Vector3(1, 1, 1);
 /**
@@ -22083,217 +22343,173 @@ const tmpScale = new Vector3(1, 1, 1);
         this.dirty = true;
         this.updateMatrix();
     }
-}
-
-/**
- * @since 2.0.0
- * @internal
- */ class CompositionComponent extends ItemBehaviour {
-    start() {
-        const { startTime = 0 } = this.item.props;
-        this.startTime = startTime;
-        this.masterTracks = [];
-        for (const sceneBinding of this.sceneBindings){
-            sceneBinding.key.binding = sceneBinding.value;
+}
+
+let listOrder = 0;
+/**
+ * 合成资源管理
+ */ class CompositionSourceManager {
+    getContent(composition) {
+        // TODO: specification 中补充 globalVolume 类型
+        // @ts-expect-error
+        const { id, duration, name, endBehavior, camera, globalVolume, startTime = 0 } = composition;
+        const items = this.assembleItems(composition);
+        return _extends({}, composition, {
+            id,
+            duration,
+            name,
+            endBehavior: isNaN(endBehavior) ? END_BEHAVIOR_PAUSE : endBehavior,
+            // looping,
+            items,
+            camera,
+            startTime,
+            globalVolume
+        });
+    }
+    assembleItems(composition) {
+        const items = [];
+        this.mask++;
+        const componentMap = {};
+        //@ts-expect-error
+        for (const component of this.jsonScene.components){
+            componentMap[component.id] = component;
         }
-        this.initializeTrackBindings(this.timelineAsset.tracks);
-        this.timelinePlayable = this.timelineAsset.createPlayable(this.graph);
-        this.timelinePlayable.play();
-        for (const track of this.timelineAsset.tracks){
-            const binding = track.binding;
-            if (binding instanceof VFXItem) {
-                // 重播不销毁元素
-                if (this.item.endBehavior !== ItemEndBehavior.destroy || this.reusable) {
-                    if (track instanceof ObjectBindingTrack) {
-                        binding.reusable = true;
+        for (const itemDataPath of composition.items){
+            //@ts-expect-error
+            const sourceItemData = this.engine.jsonSceneData[itemDataPath.id];
+            const itemProps = sourceItemData;
+            if (passRenderLevel(sourceItemData.renderLevel, this.renderLevel)) {
+                if (itemProps.type === ItemType.sprite || itemProps.type === ItemType.particle) {
+                    for (const componentPath of itemProps.components){
+                        const componentData = componentMap[componentPath.id];
+                        this.preProcessItemContent(componentData);
+                    }
+                } else {
+                    const renderContent = itemProps.content;
+                    if (renderContent) {
+                        this.preProcessItemContent(renderContent);
+                    }
+                }
+                itemProps.listIndex = listOrder++;
+                // 处理预合成的渲染顺序
+                if (itemProps.type === ItemType.composition) {
+                    const refId = sourceItemData.content.options.refId;
+                    if (!this.refCompositions.get(refId)) {
+                        throw new Error('Invalid Ref Composition id: ' + refId);
                     }
-                    const subCompositionComponent = binding.getComponent(CompositionComponent);
-                    if (subCompositionComponent) {
-                        subCompositionComponent.reusable = true;
+                    const ref = this.getContent(this.refCompositions.get(refId));
+                    if (!this.refCompositionProps.has(refId)) {
+                        this.refCompositionProps.set(refId, ref);
                     }
+                    ref.items.forEach((item)=>{
+                        this.processMask(item.content);
+                    });
+                    itemProps.items = ref.items;
                 }
+                items.push(itemProps);
             }
-            this.masterTracks.push(track);
         }
+        return items;
     }
-    initializeTrackBindings(masterTracks) {
-        for (const track of masterTracks){
-            track.initializeBindingRecursive(track.binding);
+    preProcessItemContent(renderContent) {
+        if (renderContent.renderer) {
+            renderContent.renderer = this.changeTex(renderContent.renderer);
+            if (!renderContent.renderer.mask) {
+                this.processMask(renderContent.renderer);
+            }
+            const 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);
         }
     }
-    update(dt) {
-        const time = this.time;
-        // 主合成 rootItem 没有绑定轨道，增加结束行为判断。
-        if (this.item.isEnded(this.time) && !this.item.parent) {
-            this.item.ended = true;
+    changeTex(renderer) {
+        if (!renderer.texture) {
+            return renderer;
         }
-        this.timelinePlayable.setTime(time);
-        this.graph.evaluate(dt);
-        for(let i = 0; i < this.items.length; i++){
-            const item = this.items[i];
-            const subCompostionComponent = item.getComponent(CompositionComponent);
-            if (subCompostionComponent) {
-                const subCompositionTrack = this.masterTracks[i];
-                subCompostionComponent.time = subCompositionTrack.toLocalTime(time);
-            }
+        //@ts-expect-error
+        const texIdx = renderer.texture.id;
+        if (texIdx !== undefined) {
+            //@ts-expect-error
+            this.addTextureUsage(texIdx) || texIdx;
         }
+        return renderer;
     }
-    /**
-   * 重置元素状态属性
-   */ resetStatus() {
-        this.item.ended = false;
-    }
-    createContent() {
-        const sceneBindings = [];
-        for (const sceneBindingData of this.data.sceneBindings){
-            sceneBindings.push({
-                key: this.engine.assetLoader.loadGUID(sceneBindingData.key.id),
-                value: this.engine.assetLoader.loadGUID(sceneBindingData.value.id)
-            });
-        }
-        this.sceneBindings = sceneBindings;
-        const timelineAsset = this.data.timelineAsset ? this.engine.assetLoader.loadGUID(this.data.timelineAsset.id) : new TimelineAsset(this.engine);
-        this.timelineAsset = timelineAsset;
-        const items = this.items;
-        this.items.length = 0;
-        if (this.item.composition) {
-            const assetLoader = this.item.engine.assetLoader;
-            const itemProps = this.item.props.items ? this.item.props.items : [];
-            for(let i = 0; i < itemProps.length; i++){
-                let item;
-                const itemData = itemProps[i];
-                // 设置预合成作为元素时的时长、结束行为和渲染延时
-                if (exports.Item.isComposition(itemData)) {
-                    const refId = itemData.content.options.refId;
-                    const 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;
-                    const 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 (const vfxItem of compositionComponent.items){
-                        vfxItem.setInstanceId(generateGUID());
-                        for (const component of vfxItem.components){
-                            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 (VFXItem.isExtraCamera(item)) {
-                    this.item.composition.extraCamera = item;
-                }
-                items.push(item);
+    addTextureUsage(texIdx) {
+        const texId = texIdx;
+        var _this_imgUsage;
+        // FIXME: imageUsage 取自 scene.imgUsage，类型为 Record<string, number[]>，这里给的 number，类型对不上
+        const 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]++;
         }
     }
-    onDestroy() {
-        if (this.item.composition) {
-            if (this.items) {
-                this.items.forEach((item)=>item.dispose());
-                this.items.length = 0;
+    /**
+   * 处理蒙版和遮挡关系写入 stencil 的 ref 值
+   */ processMask(renderer) {
+        const 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;
             }
         }
     }
-    hitTest(ray, x, y, regions, force, options) {
-        const hitPositions = [];
-        const stop = (options == null ? void 0 : options.stop) || noop;
-        const skip = (options == null ? void 0 : options.skip) || noop;
-        const maxCount = (options == null ? void 0 : options.maxCount) || this.items.length;
-        for(let i = 0; i < this.items.length && regions.length < maxCount; i++){
-            const item = this.items[i];
-            if (item.getVisible() && !item.ended && !VFXItem.isComposition(item) && !skip(item)) {
-                const hitParams = item.getHitTestParams(force);
-                if (hitParams) {
-                    let success = false;
-                    const intersectPoint = new Vector3();
-                    if (hitParams.type === exports.HitTestType.triangle) {
-                        const { triangles, backfaceCulling } = hitParams;
-                        for(let j = 0; j < triangles.length; j++){
-                            const triangle = triangles[j];
-                            if (ray.intersectTriangle(triangle, intersectPoint, backfaceCulling)) {
-                                success = true;
-                                hitPositions.push(intersectPoint);
-                                break;
-                            }
-                        }
-                    } else if (hitParams.type === exports.HitTestType.box) {
-                        const { center, size } = hitParams;
-                        const boxMin = center.clone().addScaledVector(size, 0.5);
-                        const 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) {
-                        const { center, radius } = hitParams;
-                        if (ray.intersectSphere({
-                            center,
-                            radius
-                        }, intersectPoint)) {
-                            success = true;
-                            hitPositions.push(intersectPoint);
-                        }
-                    } else if (hitParams.type === exports.HitTestType.custom) {
-                        const tempPosition = hitParams.collect(ray, new Vector2(x, y));
-                        if (tempPosition && tempPosition.length > 0) {
-                            tempPosition.forEach((pos)=>{
-                                hitPositions.push(pos);
-                            });
-                            success = true;
-                        }
-                    }
-                    if (success) {
-                        const region = {
-                            compContent: this.item,
-                            id: item.id,
-                            name: item.name,
-                            position: hitPositions[hitPositions.length - 1],
-                            parentId: item.parentId,
-                            hitPositions,
-                            behavior: hitParams.behavior
-                        };
-                        regions.push(region);
-                        if (stop(region)) {
-                            return regions;
-                        }
-                    }
-                }
+    dispose() {
+        this.textures = [];
+        this.composition = undefined;
+        this.jsonScene = undefined;
+        this.totalTime = 0;
+        this.pluginSystem = undefined;
+        this.sourceContent = undefined;
+        this.refCompositions.clear();
+        this.refCompositionProps.clear();
+    }
+    constructor(scene, engine){
+        this.refCompositions = new Map();
+        this.refCompositionProps = new Map();
+        this.mask = 0;
+        this.engine = engine;
+        // 资源
+        const { jsonScene, renderLevel, textureOptions, pluginSystem, totalTime } = scene;
+        const { compositions, imgUsage, compositionId } = jsonScene;
+        if (!textureOptions) {
+            throw new Error('scene.textures expected');
+        }
+        const cachedTextures = textureOptions;
+        for (const comp of compositions){
+            if (comp.id === compositionId) {
+                this.composition = comp;
+            } else {
+                this.refCompositions.set(comp.id, comp);
             }
         }
-        return regions;
-    }
-    fromData(data) {
-    // this.timelineAsset = data.timelineAsset;
-    }
-    constructor(...args){
-        super(...args);
-        this.time = 0;
-        this.startTime = 0;
-        this.items = [] // 场景的所有元素
-        ;
-        this.reusable = false;
-        this.sceneBindings = [];
-        this.masterTracks = [];
-        this.graph = new PlayableGraph();
+        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);
     }
 }
 
@@ -22303,6 +22519,11 @@ const tmpScale = new Vector3(1, 1, 1);
  * 也负责 Item 相关的动画播放控制，和持有渲染帧数据。
  */ class Composition {
     /**
+   * 所有合成 Item 的根变换
+   */ get transform() {
+        return this.rootItem.transform;
+    }
+    /**
    * 获取场景中的纹理数组
    */ get textures() {
         return this.compositionSourceManager.textures;
@@ -22336,16 +22557,8 @@ const tmpScale = new Vector3(1, 1, 1);
     /**
    * 重新开始合成
    */ 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);
     }
     /**
    * 设置当前合成的渲染顺序
@@ -22472,27 +22685,9 @@ const tmpScale = new Vector3(1, 1, 1);
     /**
    * 重置状态函数
    */ reset() {
-        const vfxItem = new 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 = ()=>{
-            window.setTimeout(()=>{
-                this.onEnd == null ? void 0 : this.onEnd.call(this, this);
-            }, 0);
-        };
+        this.rootItem.ended = false;
         this.pluginSystem.resetComposition(this, this.renderFrame);
     }
     prepareRender() {
@@ -22533,7 +22728,6 @@ const tmpScale = new Vector3(1, 1, 1);
         }
         const { ended, endBehavior } = this.rootItem;
         // TODO: 合成结束行为
-        // @ts-expect-error
         return ended && (!endBehavior || endBehavior === END_BEHAVIOR_PAUSE_AND_DESTROY);
     }
     /**
@@ -22622,7 +22816,7 @@ const tmpScale = new Vector3(1, 1, 1);
         for (const child of item.children){
             if (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 {
@@ -22989,46 +23183,48 @@ const tmpScale = new Vector3(1, 1, 1);
    * @param props - composition 的创建参数
    * @param scene
    * @param compositionSourceManager
-   */ constructor(props, scene, compositionSourceManager){
-        this.compositionSourceManager = compositionSourceManager;
-        this./**
+   */ constructor(props, scene){
+        /**
    * 动画播放速度
-   */ 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 = [];
         const { reusable = false, speed = 1, baseRenderOrder = 0, renderer, onPlayerPause, onMessageItem, onEnd, event, width, height } = props;
+        this.compositionSourceManager = new CompositionSourceManager(scene, renderer.engine);
         scene.jsonScene.imgUsage = undefined;
         if (reusable) {
             this.keepResource = true;
             scene.textures = undefined;
             scene.consumed = true;
         }
-        const { sourceContent, pluginSystem, imgUsage, totalTime, renderLevel, refCompositionProps } = this.compositionSourceManager;
+        const { sourceContent, pluginSystem, imgUsage, totalTime, refCompositionProps } = this.compositionSourceManager;
         assertExist(sourceContent);
         this.renderer = renderer;
         this.refCompositionProps = refCompositionProps;
-        const vfxItem = new 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 VFXItem(this.getEngine(), sourceContent);
+        this.rootItem.name = 'rootItem';
+        this.rootItem.composition = this;
+        this.rootComposition = this.rootItem.addComponent(CompositionComponent);
         this.rootComposition.data = sourceContent;
         const 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;
@@ -23045,9 +23241,7 @@ const 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);
@@ -23073,182 +23267,6 @@ const tmpScale = new Vector3(1, 1, 1);
     }
 }
 
-let listOrder = 0;
-/**
- * 合成资源管理
- */ class CompositionSourceManager {
-    getContent(composition) {
-        // TODO: specification 中补充 globalVolume 类型
-        // @ts-expect-error
-        const { id, duration, name, endBehavior, camera, globalVolume, startTime = 0, timelineAsset } = composition;
-        const items = this.assembleItems(composition);
-        //@ts-expect-error
-        if (!composition.sceneBindings) {
-            //@ts-expect-error
-            composition.sceneBindings = [];
-        }
-        return {
-            id,
-            duration,
-            name,
-            endBehavior: isNaN(endBehavior) ? END_BEHAVIOR_PAUSE : endBehavior,
-            // looping,
-            items,
-            camera,
-            startTime,
-            globalVolume,
-            timelineAsset: timelineAsset,
-            //@ts-expect-error
-            sceneBindings: composition.sceneBindings
-        };
-    }
-    assembleItems(composition) {
-        const items = [];
-        this.mask++;
-        const componentMap = {};
-        //@ts-expect-error
-        for (const component of this.jsonScene.components){
-            componentMap[component.id] = component;
-        }
-        for (const itemDataPath of composition.items){
-            //@ts-expect-error
-            const sourceItemData = this.engine.jsonSceneData[itemDataPath.id];
-            const itemProps = sourceItemData;
-            if (passRenderLevel(sourceItemData.renderLevel, this.renderLevel)) {
-                if (itemProps.type === ItemType.sprite || itemProps.type === ItemType.particle) {
-                    for (const componentPath of itemProps.components){
-                        const componentData = componentMap[componentPath.id];
-                        this.preProcessItemContent(componentData);
-                    }
-                } else {
-                    const renderContent = itemProps.content;
-                    if (renderContent) {
-                        this.preProcessItemContent(renderContent);
-                    }
-                }
-                itemProps.listIndex = listOrder++;
-                // 处理预合成的渲染顺序
-                if (itemProps.type === ItemType.composition) {
-                    const refId = sourceItemData.content.options.refId;
-                    if (!this.refCompositions.get(refId)) {
-                        throw new Error('Invalid Ref Composition id: ' + refId);
-                    }
-                    const ref = this.getContent(this.refCompositions.get(refId));
-                    if (!this.refCompositionProps.has(refId)) {
-                        this.refCompositionProps.set(refId, ref);
-                    }
-                    ref.items.forEach((item)=>{
-                        this.processMask(item.content);
-                    });
-                    itemProps.items = ref.items;
-                }
-                items.push(itemProps);
-            }
-        }
-        return items;
-    }
-    preProcessItemContent(renderContent) {
-        if (renderContent.renderer) {
-            renderContent.renderer = this.changeTex(renderContent.renderer);
-            if (!renderContent.renderer.mask) {
-                this.processMask(renderContent.renderer);
-            }
-            const 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);
-        }
-    }
-    changeTex(renderer) {
-        if (!renderer.texture) {
-            return renderer;
-        }
-        //@ts-expect-error
-        const texIdx = renderer.texture.id;
-        if (texIdx !== undefined) {
-            //@ts-expect-error
-            this.addTextureUsage(texIdx) || texIdx;
-        }
-        return renderer;
-    }
-    addTextureUsage(texIdx) {
-        const texId = texIdx;
-        var _this_imgUsage;
-        // FIXME: imageUsage 取自 scene.imgUsage，类型为 Record<string, number[]>，这里给的 number，类型对不上
-        const 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 值
-   */ processMask(renderer) {
-        const 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;
-            }
-        }
-    }
-    dispose() {
-        this.textures = [];
-        this.composition = undefined;
-        this.jsonScene = undefined;
-        this.totalTime = 0;
-        this.pluginSystem = undefined;
-        this.sourceContent = undefined;
-        this.refCompositions.clear();
-        this.refCompositionProps.clear();
-    }
-    constructor(scene, engine){
-        this.refCompositions = new Map();
-        this.refCompositionProps = new Map();
-        this.mask = 0;
-        this.engine = engine;
-        // 资源
-        const { jsonScene, renderLevel, textureOptions, pluginSystem, totalTime } = scene;
-        const { compositions, imgUsage, compositionId } = jsonScene;
-        if (!textureOptions) {
-            throw new Error('scene.textures expected');
-        }
-        const cachedTextures = textureOptions;
-        for (const comp of compositions){
-            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);
-    }
-}
-
 /**
  * Engine 基类，负责维护所有 GPU 资源的管理及销毁
  */ class Engine {
@@ -23272,65 +23290,48 @@ let listOrder = 0;
         delete this.objectInstance[id];
     }
     addPackageDatas(scene) {
-        const jsonScene = scene.jsonScene;
-        if (jsonScene.items) {
-            for (const vfxItemData of jsonScene.items){
-                this.addEffectsObjectData(vfxItemData);
-            }
+        const { jsonScene, textureOptions = [] } = scene;
+        const { items = [], materials = [], shaders = [], geometries = [], components = [], animations = [], bins = [] } = jsonScene;
+        for (const vfxItemData of items){
+            this.addEffectsObjectData(vfxItemData);
         }
-        if (jsonScene.materials) {
-            for (const materialData of jsonScene.materials){
-                this.addEffectsObjectData(materialData);
-            }
+        for (const materialData of materials){
+            this.addEffectsObjectData(materialData);
         }
-        if (jsonScene.shaders) {
-            for (const shaderData of jsonScene.shaders){
-                this.addEffectsObjectData(shaderData);
-            }
+        for (const shaderData of shaders){
+            this.addEffectsObjectData(shaderData);
         }
-        if (jsonScene.geometries) {
-            for (const geometryData of jsonScene.geometries){
-                this.addEffectsObjectData(geometryData);
-            }
+        for (const geometryData of geometries){
+            this.addEffectsObjectData(geometryData);
         }
-        if (jsonScene.components) {
-            for (const componentData of jsonScene.components){
-                this.addEffectsObjectData(componentData);
-            }
+        for (const componentData of components){
+            this.addEffectsObjectData(componentData);
         }
-        if (jsonScene.animations) {
-            for (const animationData of jsonScene.animations){
-                this.addEffectsObjectData(animationData);
-            }
+        for (const animationData of animations){
+            this.addEffectsObjectData(animationData);
         }
-        if (jsonScene.bins) {
-            for(let i = 0; i < jsonScene.bins.length; i++){
-                const binaryData = jsonScene.bins[i];
-                const binaryBuffer = scene.bins[i];
-                //@ts-expect-error
-                binaryData.buffer = binaryBuffer;
+        for(let i = 0; i < bins.length; i++){
+            const binaryData = bins[i];
+            const 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 (const textureData of scene.textureOptions){
-                this.addEffectsObjectData(textureData);
-            }
+        for (const textureData of textureOptions){
+            this.addEffectsObjectData(textureData);
         }
     }
     createVFXItems(scene) {
         var _this = this;
         return _async_to_generator(function*() {
-            const jsonScene = scene.jsonScene;
+            const { jsonScene } = scene;
             for (const itemData of jsonScene.items){
                 const 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)) {
                     continue;
                 }
                 if (_this.database) {
@@ -23428,21 +23429,11 @@ let listOrder = 0;
         if (info.length > 0) {
             logger.warn(`Release GPU memory: ${info.join(', ')}`);
         }
-        this.renderPasses.forEach((pass)=>{
-            pass.dispose();
-        });
-        this.meshes.forEach((mesh)=>{
-            mesh.dispose();
-        });
-        this.geometries.forEach((geo)=>{
-            geo.dispose();
-        });
-        this.materials.forEach((mat)=>{
-            mat.dispose();
-        });
-        this.textures.forEach((tex)=>{
-            tex.dispose();
-        });
+        this.renderPasses.forEach((pass)=>pass.dispose());
+        this.meshes.forEach((mesh)=>mesh.dispose());
+        this.geometries.forEach((geo)=>geo.dispose());
+        this.materials.forEach((mat)=>mat.dispose());
+        this.textures.forEach((tex)=>tex.dispose());
         this.textures = [];
         this.materials = [];
         this.geometries = [];
@@ -23689,6 +23680,8 @@ exports.SpriteColorTrack = SpriteColorTrack;
 exports.SpriteComponent = SpriteComponent;
 exports.SpriteLoader = SpriteLoader;
 exports.StaticValue = StaticValue;
+exports.SubCompositionPlayableAsset = SubCompositionPlayableAsset;
+exports.SubCompositionTrack = SubCompositionTrack;
 exports.TEMPLATE_USE_OFFSCREEN_CANVAS = TEMPLATE_USE_OFFSCREEN_CANVAS;
 exports.TextComponent = TextComponent;
 exports.TextLoader = TextLoader;
@@ -23711,6 +23704,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;
@@ -23779,6 +23773,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;