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

package/dist/index.mjs

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime core for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.0.0-alpha.16
+ * Version: v2.0.0-alpha.17
  */
 
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
@@ -324,7 +324,6 @@ function isSimulatorCellPhone() {
 }
 function isAlipayMiniApp() {
     var _my;
-    // @ts-expect-error
     return typeof my !== 'undefined' && ((_my = my) == null ? void 0 : _my.renderTarget) === 'web';
 }
 
@@ -558,8 +557,8 @@ function noop() {}
  *
  * @static
  * @function isString
- * @param {object} obj - 要判断的对象
- * @return {boolean}
+ * @param obj - 要判断的对象
+ * @return
  */ function isString(obj) {
     return typeof obj === 'string';
 }
@@ -568,8 +567,8 @@ function noop() {}
  *
  * @static
  * @function isArray
- * @param {object} obj - 要判断的对象
- * @return {boolean}
+ * @param obj - 要判断的对象
+ * @return
  */ const isArray = Array.isArray || function(obj) {
     return Object.prototype.toString.call(obj) === '[object Array]';
 };
@@ -578,8 +577,8 @@ function noop() {}
  *
  * @static
  * @function isFunction
- * @param {object} obj - 要判断的对象
- * @return {boolean}
+ * @param obj - 要判断的对象
+ * @return
  */ function isFunction(obj) {
     return Object.prototype.toString.call(obj) === '[object Function]';
 }
@@ -588,8 +587,8 @@ function noop() {}
  *
  * @static
  * @function isObject
- * @param {object} obj - 要判断的对象
- * @return {boolean}
+ * @param obj - 要判断的对象
+ * @return
  */ function isObject(obj) {
     return Object.prototype.toString.call(obj) === '[object Object]';
 }
@@ -598,25 +597,12 @@ function isCanvas(canvas) {
     // 小程序 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);
-    } else if (obj && typeof obj === 'object') {
-        if (ArrayBuffer.isView(obj)) {
-            return obj.slice();
-        }
-        const ret = {};
-        const kas = Object.keys(obj);
-        for(let i = 0; i < kas.length; i++){
-            const key = kas[i];
-            ret[key] = deepClone(obj[key]);
-        }
-        return ret;
-    }
-    return obj;
-}
-// TODO: 改名
-function random(min, max) {
+/**
+ * 生成一个位于 min 和 max 之间的随机数
+ * @param min
+ * @param max
+ * @returns
+ */ function randomInRange(min, max) {
     return min + Math.random() * (max - min);
 }
 function throwDestroyedError() {
@@ -3856,7 +3842,7 @@ var CameraClipMode;
      * 蒙版形状切分
      */ ValueType[ValueType["SHAPE_SPLITS"] = 11] = "SHAPE_SPLITS";
     /**
-     *直线路径
+     * 直线路径
      */ ValueType[ValueType["LINEAR_PATH"] = 12] = "LINEAR_PATH";
     /**
      * 多色
@@ -4032,7 +4018,7 @@ var TextAlignment;
 (function(TextAlignment) {
     /**
      * text alignment starts from（x,y) to right direction
-     * 从(x,y)开始第一个字符，向右边延伸
+     * 从 (x,y) 开始第一个字符，向右边延伸
      */ TextAlignment[TextAlignment["left"] = 0] = "left";
     /**
      * (x,y) is middle position of text, where (left + right)/2 =(x,y)
@@ -4040,7 +4026,7 @@ var TextAlignment;
      */ TextAlignment[TextAlignment["middle"] = 1] = "middle";
     /**
      * text alignment ends with（x,y) from left direction
-     * 从(x,y)结束最后一个字符，向左边延伸
+     * 从 (x,y) 结束最后一个字符，向左边延伸
      */ TextAlignment[TextAlignment["right"] = 2] = "right";
 })(TextAlignment || (TextAlignment = {}));
 /**
@@ -4090,6 +4076,7 @@ var DataType;
     DataType["TimelineAsset"] = "TimelineAsset";
     DataType["TransformPlayableAsset"] = "TransformPlayableAsset";
     DataType["SpriteColorPlayableAsset"] = "SpriteColorPlayableAsset";
+    DataType["BinaryAsset"] = "BinaryAsset";
     // FIXME: 先完成ECS的场景转换，后面移到spec中
     DataType["MeshComponent"] = "MeshComponent";
     DataType["SkyboxComponent"] = "SkyboxComponent";
@@ -4098,6 +4085,7 @@ var DataType;
     DataType["ModelPluginComponent"] = "ModelPluginComponent";
     DataType["TreeComponent"] = "TreeComponent";
     DataType["AnimationComponent"] = "AnimationComponent";
+    DataType["SpineComponent"] = "SpineComponent";
     // Non-EffectObject
     DataType["TimelineClip"] = "TimelineClip";
 })(DataType || (DataType = {}));
@@ -4185,11 +4173,11 @@ var VertexBufferSemantic;
     VertexBufferSemantic["TangentBS3"] = "TANGENT_BS3";
 })(VertexBufferSemantic || (VertexBufferSemantic = {}));
 
-class BuiltinObjectGUID {
-}
-BuiltinObjectGUID.WhiteTexture = 'whitetexture00000000000000000000';
-BuiltinObjectGUID.PBRShader = 'pbr00000000000000000000000000000';
-BuiltinObjectGUID.UnlitShader = 'unlit000000000000000000000000000';
+const BuiltinObjectGUID = {
+    WhiteTexture: 'whitetexture00000000000000000000',
+    PBRShader: 'pbr00000000000000000000000000000',
+    UnlitShader: 'unlit000000000000000000000000000'
+};
 
 var index$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
@@ -4245,15 +4233,20 @@ var index$1 = /*#__PURE__*/Object.freeze({
     BuiltinObjectGUID: BuiltinObjectGUID
 });
 
-const effectsClassStore = {};
 const decoratorInitialStore = {};
 const mergedStore = {};
-function getDirectStore(target) {
-    const classKey = target.constructor.name;
-    if (!decoratorInitialStore[classKey]) {
-        decoratorInitialStore[classKey] = {};
-    }
-    return decoratorInitialStore[classKey];
+const effectsClassStore = {};
+function effectsClass(className) {
+    return (target, context)=>{
+        if (effectsClassStore[className]) {
+            console.warn(`Class ${className} 重复注册`);
+        }
+        // TODO: three修改json dataType, 这边重复注册直接 return
+        effectsClassStore[className] = target;
+    };
+}
+function serialize(type, sourceName) {
+    return generateSerializableMember(type, sourceName); // value member
 }
 function getMergedStore(target) {
     const classKey = target.constructor.name;
@@ -4278,34 +4271,32 @@ function getMergedStore(target) {
     }
     return store;
 }
-function serialize(type, sourceName) {
-    return generateSerializableMember(type, sourceName); // value member
-}
-function effectsClass(className) {
-    return (target, context)=>{
-        if (effectsClassStore[className]) {
-            console.warn('Class ' + className + ' 重复注册');
-        }
-        //TODO: three修改json dataType, 这边重复注册直接 return
-        effectsClassStore[className] = target;
-    };
-}
 function generateSerializableMember(type, sourceName) {
     return (target, propertyKey)=>{
         const classStore = getDirectStore(target);
         if (!classStore[propertyKey]) {
             classStore[propertyKey] = {
-                type: type,
-                sourceName: sourceName
+                type,
+                sourceName
             };
         }
     };
 }
+function getDirectStore(target) {
+    const classKey = target.constructor.name;
+    if (!decoratorInitialStore[classKey]) {
+        decoratorInitialStore[classKey] = {};
+    }
+    return decoratorInitialStore[classKey];
+}
 
 /**
  * @since 2.0.0
  * @internal
  */ class EffectsObject {
+    static is(obj) {
+        return obj instanceof EffectsObject && 'guid' in obj;
+    }
     getInstanceId() {
         return this.guid;
     }
@@ -4501,6 +4492,7 @@ __decorate([
         super(...args);
         this.started = false;
         this.materials = [];
+        this._priority = 0;
         this._enabled = true;
     }
 }
@@ -9209,7 +9201,7 @@ class RandomValue extends ValueGetter {
         this.max = props[1];
     }
     getValue(time) {
-        return random(this.min, this.max);
+        return randomInRange(this.min, this.max);
     }
     toUniform() {
         return new Float32Array([
@@ -13779,7 +13771,7 @@ class Cone {
         // dir + [0,0,1]
         dir.z += 1;
         return {
-            position: position.multiply(random(0, 1)),
+            position: position.multiply(randomInRange(0, 1)),
             direction: dir.normalize()
         };
     }
@@ -13791,7 +13783,7 @@ class Cone {
 }
 function getArcAngle(arc, arcMode, opt) {
     if (arcMode === ShapeArcMode.RANDOM) {
-        arc = random(0, arc);
+        arc = randomInRange(0, arc);
     } else if (arcMode === ShapeArcMode.UNIDIRECTIONAL_CYCLE) {
         const d = opt.index % (opt.total + 1);
         arc = arc / opt.total * d;
@@ -13823,8 +13815,8 @@ class Circle {
 }
 class Rectangle {
     generate(opt) {
-        const x = random(-this._d, this._d);
-        const y = random(-this._h, this._h);
+        const x = randomInRange(-this._d, this._d);
+        const y = randomInRange(-this._h, this._h);
         return {
             direction: new Vector3(0, 0, 1),
             position: new Vector3(x, y, 0)
@@ -13869,7 +13861,7 @@ class RectangleEdge {
 }
 class Edge {
     generate(options) {
-        const x = this.arcMode === ShapeArcMode.UNIFORM_BURST ? options.burstIndex % options.burstCount / (options.burstCount - 1) : random(0, 1);
+        const x = this.arcMode === ShapeArcMode.UNIFORM_BURST ? options.burstIndex % options.burstCount / (options.burstCount - 1) : randomInRange(0, 1);
         return {
             direction: new Vector3(0, 1, 0),
             position: new Vector3(this._d * (x - 0.5), 0, 0)
@@ -13887,7 +13879,7 @@ class Donut {
     generate(opt) {
         const dradius = this.donutRadius;
         const center = this.radius - dradius;
-        const angle = random(0, Math.PI * 2);
+        const angle = randomInRange(0, Math.PI * 2);
         const arc = getArcAngle(this.arc, this.arcMode, opt) * DEG2RAD;
         const rot = tempMat4$2.setFromRotationZ(arc);
         const direction = new Vector3(Math.cos(angle), Math.sin(angle), 0);
@@ -13907,7 +13899,7 @@ class Donut {
 const tempMat4$1 = new Matrix4();
 class Sphere {
     getHorizontalAngle() {
-        return random(-90, 90);
+        return randomInRange(-90, 90);
     }
     generate(opt) {
         const rz = getArcAngle(this.arc, this.arcMode, opt) * DEG2RAD;
@@ -13929,7 +13921,7 @@ class Sphere {
 }
 class Hemisphere extends Sphere {
     getHorizontalAngle() {
-        return random(0, 90);
+        return randomInRange(0, 90);
     }
 }
 
@@ -15925,11 +15917,9 @@ class ParticleSystem extends Component {
         this.props = props;
         this.destroyed = false;
         const cachePrefix = '';
-        const options = props.options;
-        const positionOverLifetime = props.positionOverLifetime;
-        const shape = props.shape;
-        const gravityModifier = positionOverLifetime.gravityOverLifetime;
-        const gravity = ensureVec3(positionOverLifetime.gravity);
+        const { options, positionOverLifetime = {}, shape } = props;
+        const gravityModifier = positionOverLifetime == null ? void 0 : positionOverLifetime.gravityOverLifetime;
+        const gravity = ensureVec3(positionOverLifetime == null ? void 0 : positionOverLifetime.gravity);
         const _textureSheetAnimation = props.textureSheetAnimation;
         const textureSheetAnimation = _textureSheetAnimation ? {
             animationDelay: createValueGetter(_textureSheetAnimation.animationDelay || 0),
@@ -15940,7 +15930,7 @@ class ParticleSystem extends Component {
             row: _textureSheetAnimation.row,
             total: _textureSheetAnimation.total || _textureSheetAnimation.col * _textureSheetAnimation.row
         } : undefined;
-        const startTurbulence = !!(shape && shape.turbulenceX || shape.turbulenceY || shape.turbulenceZ);
+        const startTurbulence = !!(shape && shape.turbulenceX || (shape == null ? void 0 : shape.turbulenceY) || (shape == null ? void 0 : shape.turbulenceZ));
         let turbulence;
         if (startTurbulence) {
             var _shape_turbulenceX, _shape_turbulenceY, _shape_turbulenceZ;
@@ -15971,7 +15961,7 @@ class ParticleSystem extends Component {
             }
         }
         let forceTarget;
-        if (positionOverLifetime.forceTarget) {
+        if (positionOverLifetime == null ? void 0 : positionOverLifetime.forceTarget) {
             forceTarget = {
                 target: positionOverLifetime.target || [
                     0,
@@ -17590,6 +17580,27 @@ class AnimationClipPlayable extends Playable {
     }
 }
 
+/**
+ * @since 2.0.0
+ * @internal
+ */ class TimelineClip {
+    toLocalTime(time) {
+        let localTime = time - this.start;
+        const duration = this.duration;
+        if (localTime - duration > 0.001) {
+            if (this.endBehaviour === ItemEndBehavior.loop) {
+                localTime = localTime % duration;
+            } else if (this.endBehaviour === ItemEndBehavior.freeze) {
+                localTime = Math.min(duration, localTime);
+            }
+        }
+        return localTime;
+    }
+    constructor(){
+        this.start = 0;
+        this.duration = 0;
+    }
+}
 class TrackAsset extends PlayableAsset {
     /**
    * 重写该方法以获取自定义对象绑定
@@ -17670,7 +17681,7 @@ class TrackAsset extends PlayableAsset {
     }
 }
 __decorate([
-    serialize('TimelineClip')
+    serialize(TimelineClip)
 ], TrackAsset.prototype, "clips", void 0);
 __decorate([
     serialize()
@@ -17683,27 +17694,6 @@ var TrackType;
     TrackType[TrackType["MasterTrack"] = 0] = "MasterTrack";
     TrackType[TrackType["ObjectTrack"] = 1] = "ObjectTrack";
 })(TrackType || (TrackType = {}));
-class TimelineClip {
-    toLocalTime(time) {
-        let localTime = time - this.start;
-        const duration = this.duration;
-        if (localTime - duration > 0.001) {
-            if (this.endBehaviour === ItemEndBehavior.loop) {
-                localTime = localTime % duration;
-            } else if (this.endBehaviour === ItemEndBehavior.freeze) {
-                localTime = Math.min(duration, localTime);
-            }
-        }
-        return localTime;
-    }
-    constructor(){
-        this.start = 0;
-        this.duration = 0;
-    }
-}
-TimelineClip = __decorate([
-    effectsClass('TimelineClip')
-], TimelineClip);
 class RuntimeClip {
     set enable(value) {
         if (value) {
@@ -17778,10 +17768,6 @@ class ObjectBindingTrack extends TrackAsset {
             particleClip.endBehaviour = boundItem.endBehavior;
         }
     }
-    fromData(data) {
-        super.fromData(data);
-        this.data = data;
-    }
 }
 ObjectBindingTrack = __decorate([
     effectsClass('ObjectBindingTrack')
@@ -17967,7 +17953,6 @@ function compareTracks(a, b) {
         this.startTime = startTime;
         this.resolveBindings();
         this.timelinePlayable = this.timelineAsset.createPlayable(this.graph);
-        this.timelinePlayable.play();
         // 重播不销毁元素
         if (this.item.endBehavior !== ItemEndBehavior.destroy) {
             this.setReusable(true);
@@ -18351,7 +18336,6 @@ class CanvasPool {
             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
@@ -19175,7 +19159,6 @@ class VFXItem extends EffectsObject {
         this.parentId = parentId;
         this.duration = duration;
         this.endBehavior = endBehavior;
-        this.renderOrder = listIndex;
         //@ts-expect-error
         this.oldId = data.oldId;
         if (!data.content) {
@@ -19186,17 +19169,11 @@ class VFXItem extends EffectsObject {
         if (duration <= 0) {
             throw Error(`Item duration can't be less than 0, see ${HELP_LINK['Item duration can\'t be less than 0']}`);
         }
-        if (data.components) {
-            for (const component of data.components){
-                const newComponent = component;
-                this.components.push(newComponent);
-                if (newComponent instanceof RendererComponent) {
-                    this.rendererComponents.push(newComponent);
-                } else if (newComponent instanceof ItemBehaviour) {
-                    this.itemBehaviours.push(newComponent);
-                }
-            }
+        for (const component of this.components){
+            component.onAttached();
         }
+        // renderOrder 在 component 初始化后设置。确保能拿到 rendererComponent。
+        this.renderOrder = listIndex;
     }
     toData() {
         var _this_parent;
@@ -19291,6 +19268,7 @@ class VFXItem extends EffectsObject {
         /**
    * 元素动画的速度
    */ this.speed = 1;
+        this.listIndex = 0;
         this.name = 'VFXItem';
         this.transform.name = this.name;
         this.transform.engine = engine;
@@ -19299,6 +19277,9 @@ class VFXItem extends EffectsObject {
         }
     }
 }
+__decorate([
+    serialize()
+], VFXItem.prototype, "components", void 0);
 VFXItem = __decorate([
     effectsClass(DataType.VFXItemData)
 ], VFXItem);
@@ -19494,20 +19475,20 @@ class SerializationHelper {
             if (value === undefined) {
                 value = effectsObject[key];
             }
-            if (value instanceof EffectsObject) {
-                this.collectSerializableObject(value, res);
-            } else if (value instanceof Array) {
+            if (EffectsObject.is(value)) {
+                SerializationHelper.collectSerializableObject(value, res);
+            } else if (isArray(value)) {
                 for (const arrayValue of value){
-                    if (arrayValue instanceof EffectsObject) {
-                        this.collectSerializableObject(arrayValue, res);
+                    if (EffectsObject.is(arrayValue)) {
+                        SerializationHelper.collectSerializableObject(arrayValue, res);
                     }
                 }
-            } else if (value instanceof Object) {
+            } else if (isObject(value)) {
                 // 非 EffectsObject 对象只递归一层
                 for (const objectKey of Object.keys(value)){
                     const objectValue = value[objectKey];
-                    if (objectValue instanceof EffectsObject) {
-                        this.collectSerializableObject(objectValue, res);
+                    if (EffectsObject.is(objectValue)) {
+                        SerializationHelper.collectSerializableObject(objectValue, res);
                     }
                 }
             }
@@ -19542,17 +19523,17 @@ class SerializationHelper {
             if (typeof value === 'number' || typeof value === 'string' || typeof value === 'boolean' || SerializationHelper.checkTypedArray(value)) {
                 // TODO json 数据避免传 typedArray
                 serializedData[key] = value;
-            } else if (value instanceof Array) {
+            } else if (isArray(value)) {
                 if (!serializedData[key]) {
                     serializedData[key] = [];
                 }
                 SerializationHelper.serializeArrayProperty(value, serializedData[key], 0);
-            } else if (value instanceof EffectsObject) {
+            } else if (EffectsObject.is(value)) {
                 // TODO 处理 EffectsObject 递归序列化
                 serializedData[key] = {
                     id: value.getInstanceId()
                 };
-            } else if (value instanceof Object) {
+            } else if (isObject(value)) {
                 if (!serializedData[key]) {
                     serializedData[key] = {};
                 }
@@ -19565,17 +19546,17 @@ class SerializationHelper {
             if (typeof value === 'number' || typeof value === 'string' || typeof value === 'boolean' || SerializationHelper.checkTypedArray(value)) {
                 // TODO json 数据避免传 typedArray
                 serializedData[key] = value;
-            } else if (value instanceof Array) {
+            } else if (isArray(value)) {
                 if (!serializedData[key]) {
                     serializedData[key] = [];
                 }
                 SerializationHelper.serializeArrayProperty(value, serializedData[key], 0);
-            } else if (value instanceof EffectsObject) {
+            } else if (EffectsObject.is(value)) {
                 // TODO 处理 EffectsObject 递归序列化
                 serializedData[key] = {
                     id: value.getInstanceId()
                 };
-            } else if (value instanceof Object) {
+            } else if (isObject(value)) {
                 if (!serializedData[key]) {
                     serializedData[key] = {};
                 }
@@ -19635,13 +19616,13 @@ class SerializationHelper {
     static checkTypedArray(obj) {
         return obj instanceof Int8Array || obj instanceof Uint8Array || obj instanceof Uint8ClampedArray || obj instanceof Int16Array || obj instanceof Uint16Array || obj instanceof Int32Array || obj instanceof Uint32Array || obj instanceof Float32Array || obj instanceof Float64Array || obj instanceof ArrayBuffer;
     }
+    // check value is { id: 7e69662e964e4892ae8933f24562395b }
     static checkDataPath(value) {
-        // check value is { id: 7e69662e964e4892ae8933f24562395b }
-        return value instanceof Object && Object.keys(value).length === 1 && value.id && value.id.length === 32;
+        return !!(isObject(value) && Object.keys(value).length === 1 && 'id' in value && isString(value.id) && value.id.length === 32);
     }
     // TODO 测试函数，2.0 上线后移除
     static checkGLTFNode(value) {
-        return value instanceof Object && value.nodeIndex !== undefined && value.isJoint !== undefined;
+        return isObject(value) && value.nodeIndex !== undefined && value.isJoint !== undefined;
     }
     static checkImageSource(value) {
         return isCanvas(value) || value instanceof HTMLImageElement;
@@ -19652,7 +19633,7 @@ class SerializationHelper {
             return;
         }
         // 加载并链接 DataPath 字段表示的 EffectsObject 引用。Class 对象 copy [key, value] 会丢失对象信息，因此只递归数组对象和普通 js Object 结构对象。
-        if (property instanceof Array) {
+        if (isArray(property)) {
             const res = [];
             for (const value of property){
                 res.push(SerializationHelper.deserializeProperty(value, engine, level + 1, type));
@@ -19661,16 +19642,14 @@ class SerializationHelper {
         // TODO json 数据避免传 typedArray
         } else if (SerializationHelper.checkDataPath(property)) {
             return engine.assetLoader.loadGUID(property.id);
-        } else if (property instanceof Object && property.constructor === Object) {
+        } else if (isObject(property) && property.constructor === Object) {
             let res;
             if (type) {
-                const classConstructor = effectsClassStore[type];
-                res = new classConstructor();
+                res = new type();
             } else {
                 res = {};
             }
             for (const key of Object.keys(property)){
-                // @ts-expect-error
                 res[key] = SerializationHelper.deserializeProperty(property[key], engine, level + 1);
             }
             return res;
@@ -19684,7 +19663,7 @@ class SerializationHelper {
                 console.error('序列化数据的内嵌对象层数大于上限');
                 return;
             }
-            if (property instanceof Array) {
+            if (isArray(property)) {
                 const res = [];
                 for (const value of property){
                     res.push((yield SerializationHelper.deserializePropertyAsync(value, engine, level + 1, type)));
@@ -19694,16 +19673,14 @@ class SerializationHelper {
             } else if (SerializationHelper.checkDataPath(property)) {
                 const res = yield engine.assetLoader.loadGUIDAsync(property.id);
                 return res;
-            } else if (property instanceof Object && property.constructor === Object) {
+            } else if (isObject(property) && property.constructor === Object) {
                 let res;
                 if (type) {
-                    const classConstructor = effectsClassStore[type];
-                    res = new classConstructor();
+                    res = new type();
                 } else {
                     res = {};
                 }
                 for (const key of Object.keys(property)){
-                    // @ts-expect-error
                     res[key] = SerializationHelper.deserializeProperty(property[key], engine, level + 1);
                 }
                 return res;
@@ -19725,17 +19702,17 @@ class SerializationHelper {
             if (typeof value === 'number' || typeof value === 'string' || typeof value === 'boolean' || SerializationHelper.checkTypedArray(objectProperty)) {
                 // TODO json 数据避免传 typedArray
                 serializedData[key] = value;
-            } else if (value instanceof Array) {
+            } else if (isArray(value)) {
                 if (!serializedData[key]) {
                     serializedData[key] = [];
                 }
                 SerializationHelper.serializeArrayProperty(value, serializedData[key], level + 1);
-            } else if (value instanceof EffectsObject) {
+            } else if (EffectsObject.is(value)) {
                 // TODO 处理 EffectsObject 递归序列化
                 serializedData[key] = {
                     id: value.getInstanceId()
                 };
-            } else if (value instanceof Object) {
+            } else if (isObject(value)) {
                 if (!serializedData[key]) {
                     serializedData[key] = {};
                 }
@@ -19756,17 +19733,17 @@ class SerializationHelper {
             if (typeof value === 'number' || typeof value === 'string' || typeof value === 'boolean' || SerializationHelper.checkTypedArray(arrayProperty)) {
                 // TODO json 数据避免传 typedArray
                 serializedData[i] = value;
-            } else if (value instanceof Array) {
+            } else if (isArray(value)) {
                 if (!serializedData[i]) {
                     serializedData[i] = [];
                 }
-                this.serializeArrayProperty(value, serializedData[i], level + 1);
-            } else if (value instanceof EffectsObject) {
+                SerializationHelper.serializeArrayProperty(value, serializedData[i], level + 1);
+            } else if (EffectsObject.is(value)) {
                 // TODO 处理 EffectsObject 递归序列化
                 serializedData[i] = {
                     id: value.getInstanceId()
                 };
-            } else if (value instanceof Object) {
+            } else if (isObject(value)) {
                 if (!serializedData[i]) {
                     serializedData[i] = {};
                 }
@@ -20697,8 +20674,6 @@ function getStandardCameraContent(model) {
 /**
  * 3.0 以下版本数据适配（runtime 2.0及以上版本支持）
  */ function version30Migration(json) {
-    var // 更正 spine 数据中的 images 属性
-    _json_spines;
     var // 兼容老版本数据中不存在textures的情况
     _result;
     const result = _extends({}, json, {
@@ -20708,7 +20683,8 @@ function getStandardCameraContent(model) {
         materials: [],
         shaders: [],
         geometries: [],
-        animations: []
+        animations: [],
+        miscs: []
     });
     // image数据添加 guid
     for (const image of result.images){
@@ -20737,17 +20713,10 @@ function getStandardCameraContent(model) {
             });
         }
     }
-    (_json_spines = json.spines) == null ? void 0 : _json_spines.forEach((spine)=>{
-        for(let i = 0; i < spine.images.length; i++){
-            var _json_textures_spine_images_i;
-            //@ts-expect-error
-            const textureId = (_json_textures_spine_images_i = json.textures[spine.images[i]]) == null ? void 0 : _json_textures_spine_images_i.id;
-            //@ts-expect-error
-            spine.images[i] = {
-                id: textureId
-            };
-        }
-    });
+    // 处理老版本数据中 bins 没有 id 的情况
+    if (json.bins) {
+        convertBinaryAsset(json.bins, result);
+    }
     const itemOldIdToGuidMap = {};
     const guidToItemMap = {};
     // 更正Composition.endBehavior
@@ -20968,6 +20937,10 @@ function getStandardCameraContent(model) {
             //@ts-expect-error
             item.type = 'orientation-transformer';
         }
+        // Spine 元素转为 guid 索引
+        if (item.type === ItemType.spine && json.spines && json.spines.length !== 0) {
+            convertSpineData(json.spines[item.content.options.spine], item.content, result);
+        }
         // 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 || 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 = [];
@@ -21211,20 +21184,48 @@ function convertTimelineAsset(composition, guidToItemMap, jsonScene) {
         id: timelineAssetData.id
     };
     composition.sceneBindings = sceneBindings;
-    if (!jsonScene.animations) {
-        jsonScene.animations = [];
-    }
-    // @ts-expect-error
-    jsonScene.animations.push(timelineAssetData);
+    jsonScene.miscs.push(timelineAssetData);
     for (const trackData of trackDatas){
         //@ts-expect-error
-        jsonScene.animations.push(trackData);
+        jsonScene.miscs.push(trackData);
     }
     for (const playableAsset of playableAssetDatas){
         //@ts-expect-error
-        jsonScene.animations.push(playableAsset);
+        jsonScene.miscs.push(playableAsset);
     }
 }
+function convertBinaryAsset(bins, jsonScene) {
+    //@ts-expect-error
+    jsonScene.bins = bins.map((bin)=>({
+            url: bin.url,
+            'dataType': 'BinaryAsset',
+            id: generateGUID()
+        }));
+}
+function convertSpineData(resource, content, jsonScene) {
+    //@ts-expect-error
+    content.resource = {
+        'atlas': {
+            'bins': {
+                //@ts-expect-error
+                'id': jsonScene.bins[resource.atlas[1][0]].id
+            },
+            'source': resource.atlas[1].slice(1)
+        },
+        'skeleton': {
+            'bins': {
+                //@ts-expect-error
+                'id': jsonScene.bins[resource.skeleton[1][0]].id
+            },
+            'source': resource.skeleton[1].slice(1)
+        },
+        'skeletonType': resource.skeletonType,
+        'images': resource.images.map((i)=>({
+                //@ts-expect-error
+                id: jsonScene.textures[i].id
+            }))
+    };
+}
 
 const v0 = /^(\d+)\.(\d+)\.(\d+)(-(\w+)\.\d+)?$/;
 const standardVersion = /^(\d+)\.(\d+)$/;
@@ -21783,7 +21784,7 @@ let seed = 1;
             const shaderLibrary = renderer == null ? void 0 : renderer.getShaderLibrary();
             yield pluginSystem == null ? void 0 : pluginSystem.precompile(compositions, renderer, options);
             yield new Promise((resolve)=>{
-                shaderLibrary.compileAllShaders(()=>{
+                shaderLibrary == null ? void 0 : shaderLibrary.compileAllShaders(()=>{
                     resolve(null);
                 });
             });
@@ -23287,7 +23288,7 @@ let listOrder = 0;
     }
     addPackageDatas(scene) {
         const { jsonScene, textureOptions = [] } = scene;
-        const { items = [], materials = [], shaders = [], geometries = [], components = [], animations = [], bins = [] } = jsonScene;
+        const { items = [], materials = [], shaders = [], geometries = [], components = [], animations = [], bins = [], miscs = [] } = jsonScene;
         for (const vfxItemData of items){
             this.addEffectsObjectData(vfxItemData);
         }
@@ -23306,6 +23307,9 @@ let listOrder = 0;
         for (const animationData of animations){
             this.addEffectsObjectData(animationData);
         }
+        for (const miscData of miscs){
+            this.addEffectsObjectData(miscData);
+        }
         for(let i = 0; i < bins.length; i++){
             const binaryData = bins[i];
             const binaryBuffer = scene.bins[i];
@@ -23579,5 +23583,5 @@ registerPlugin('particle', ParticleLoader, VFXItem, true);
 registerPlugin('cal', CalculateLoader, VFXItem, true);
 registerPlugin('interact', InteractLoader, VFXItem, true);
 
-export { AbstractPlugin, ActivationPlayable, ActivationPlayableAsset, ActivationTrack, AnimationClip, AnimationClipPlayable, AssetLoader, AssetManager, BYTES_TYPE_MAP, Behaviour, BezierCurve, BezierCurvePath, BezierCurveQuat, BinaryAsset, COMPRESSED_TEXTURE, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateLoader, Camera, CameraController, CameraVFXItemLoader, Component, Composition, CompositionComponent, CompositionSourceManager, DEFAULT_FONTS, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, Engine, EventSystem, FilterMode, Float16ArrayWrapper, Framebuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractComponent, InteractLoader, InteractMesh, Item, ItemBehaviour, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, Mesh, ObjectBindingTrack, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleBehaviourPlayableAsset, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, PassTextureCache, PathSegments, PluginSystem, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderbuffer, Renderer, RendererComponent, RuntimeClip, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderType, ShaderVariant, SpriteColorPlayable, SpriteColorPlayableAsset, SpriteColorTrack, SpriteComponent, SpriteLoader, StaticValue, SubCompositionPlayableAsset, SubCompositionTrack, TEMPLATE_USE_OFFSCREEN_CANVAS, TextComponent, TextLoader, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, Ticker, TimelineAsset, TimelineClip, TimelinePlayable, TrackAsset, TrackSortWrapper, TrackType, Transform, TransformAnimationPlayable, TransformPlayableAsset, TransformTrack, VFXItem, ValueGetter, addByOrder, addItem, addItemWithOrder, assertExist, asserts, base64ToFile, blend, calculateTranslation, canvasPool, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, compatible_frag as compatibleFrag, compatible_vert as compatibleVert, createCopyShader, createGLContext, createKeyFrameMeta, createShaderWithMarcos, createShape, createVFXItem, createValueGetter, decimalEqual, deepClone, defaultGlobalVolume, defaultPlugins, deserializeMipmapTexture, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureFixedNumber, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, generateTransparentTexture, generateWhiteTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTemplateCanvasPool, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, glType2VertexFormatType, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAlipayMiniApp, isAndroid, isArray, isCanvas, isFunction, isIOS, isObject, isSceneJSON, isSceneURL, isSceneWithOptions, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isValidFontFamily, isWebGL2, itemFrag, itemFrameFrag, itemVert, loadBinary, loadBlob, loadImage, loadMedia, loadVideo, loadWebPOptional, logger, index as math, maxSpriteMeshItemCount, maxSpriteTextureCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, normalizeColor, numberToFix, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap$1 as particleOriginTranslateMap, particleUniformTypeMap, particleVert, pluginLoaderMap, pointOnLine, random, registerPlugin, removeItem, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxFragmentTextures, setSpriteMeshMaxItemCountByGPU, sortByOrder, index$1 as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecAssign, vecFill, vecMulCombine, vecNormalize, vertexFormatType2GLType };
+export { AbstractPlugin, ActivationPlayable, ActivationPlayableAsset, ActivationTrack, AnimationClip, AnimationClipPlayable, AssetLoader, AssetManager, BYTES_TYPE_MAP, Behaviour, BezierCurve, BezierCurvePath, BezierCurveQuat, BinaryAsset, COMPRESSED_TEXTURE, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateLoader, Camera, CameraController, CameraVFXItemLoader, Component, Composition, CompositionComponent, CompositionSourceManager, DEFAULT_FONTS, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, Engine, EventSystem, FilterMode, Float16ArrayWrapper, Framebuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, HELP_LINK, HitTestType, InteractComponent, InteractLoader, InteractMesh, Item, ItemBehaviour, KTXTexture, LineSegments, LinearValue, Material, MaterialDataBlock, MaterialRenderType, Mesh, ObjectBindingTrack, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleBehaviourPlayableAsset, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, PassTextureCache, PathSegments, PluginSystem, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderbuffer, Renderer, RendererComponent, RuntimeClip, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderType, ShaderVariant, SpriteColorPlayable, SpriteColorPlayableAsset, SpriteColorTrack, SpriteComponent, SpriteLoader, StaticValue, SubCompositionPlayableAsset, SubCompositionTrack, TEMPLATE_USE_OFFSCREEN_CANVAS, TextComponent, TextLayout, TextLoader, TextStyle, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, Ticker, TimelineAsset, TimelineClip, TimelinePlayable, TrackAsset, TrackSortWrapper, TrackType, Transform, TransformAnimationPlayable, TransformPlayableAsset, TransformTrack, VFXItem, ValueGetter, addByOrder, addItem, addItemWithOrder, assertExist, asserts, base64ToFile, blend, calculateTranslation, canvasPool, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, compatible_frag as compatibleFrag, compatible_vert as compatibleVert, createCopyShader, createGLContext, createKeyFrameMeta, createShaderWithMarcos, createShape, createVFXItem, createValueGetter, decimalEqual, defaultGlobalVolume, defaultPlugins, deserializeMipmapTexture, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureFixedNumber, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, generateTransparentTexture, generateWhiteTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTemplateCanvasPool, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getImageItemRenderInfo, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, glType2VertexFormatType, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAlipayMiniApp, isAndroid, isArray, isCanvas, isFunction, isIOS, isObject, isSceneJSON, isSceneURL, isSceneWithOptions, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isValidFontFamily, isWebGL2, itemFrag, itemFrameFrag, itemVert, loadBinary, loadBlob, loadImage, loadMedia, loadVideo, loadWebPOptional, logger, index as math, maxSpriteMeshItemCount, maxSpriteTextureCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, normalizeColor, numberToFix, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap$1 as particleOriginTranslateMap, particleUniformTypeMap, particleVert, pluginLoaderMap, pointOnLine, randomInRange, registerPlugin, removeItem, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxFragmentTextures, setSpriteMeshMaxItemCountByGPU, sortByOrder, index$1 as spec, spriteMeshShaderFromFilter, spriteMeshShaderFromRenderInfo, spriteMeshShaderIdFromRenderInfo, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecAssign, vecFill, vecMulCombine, vecNormalize, vertexFormatType2GLType };
 //# sourceMappingURL=index.mjs.map