@galacean/engine-core 1.4.0-alpha.0 → 1.4.0-alpha.1

package/dist/main.js

@@ -98,6 +98,34 @@ function __decorate(decorators, target, key, desc) {
   return c > 3 && r && Object.defineProperty(target, key, r), r;
 }
 
+function __generator(thisArg, body) {
+  var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+  return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+  function verb(n) { return function (v) { return step([n, v]); }; }
+  function step(op) {
+      if (f) throw new TypeError("Generator is already executing.");
+      while (g && (g = 0, op[0] && (_ = 0)), _) try {
+          if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+          if (y = 0, t) op = [op[0] & 2, t.value];
+          switch (op[0]) {
+              case 0: case 1: t = op; break;
+              case 4: _.label++; return { value: op[1], done: false };
+              case 5: _.label++; y = op[1]; op = [0]; continue;
+              case 7: op = _.ops.pop(); _.trys.pop(); continue;
+              default:
+                  if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                  if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                  if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                  if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                  if (t[2]) _.ops.pop();
+                  _.trys.pop(); continue;
+          }
+          op = body.call(thisArg, _);
+      } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+      if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+  }
+}
+
 typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
   var e = new Error(message);
   return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
@@ -5176,11 +5204,13 @@ __decorate([
     /**
    * @internal
    * @todo Should merge when we can delete material render state
-   */ _proto._applyRenderQueueByShaderData = function _applyRenderQueueByShaderData(renderStateDataMap, shaderData) {
+   */ _proto._getRenderQueueByShaderData = function _getRenderQueueByShaderData(renderStateDataMap, shaderData) {
         var renderQueueType = renderStateDataMap[RenderStateElementKey.RenderQueueType];
-        if (renderQueueType !== undefined) {
+        if (renderQueueType === undefined) {
+            return this.renderQueueType;
+        } else {
             var _shaderData_getFloat;
-            this.renderQueueType = (_shaderData_getFloat = shaderData.getFloat(renderQueueType)) != null ? _shaderData_getFloat : RenderQueueType.Opaque;
+            return (_shaderData_getFloat = shaderData.getFloat(renderQueueType)) != null ? _shaderData_getFloat : RenderQueueType.Opaque;
         }
     };
     _proto._applyStatesByShaderData = function _applyStatesByShaderData(renderStateDataMap, shaderData) {
@@ -5989,12 +6019,18 @@ __decorate([
     /**
    * @internal
    */ ComponentsDependencies._removeCheck = function _removeCheck(entity, type) {
+        var components = entity._components;
+        var n = components.length;
         while(type !== Component){
+            var count = 0;
+            for(var i = 0; i < n; i++){
+                if (_instanceof(components[i], type) && ++count > 1) return;
+            }
             var invDependencies = ComponentsDependencies._invDependenciesMap.get(type);
             if (invDependencies) {
-                for(var i = 0, len = invDependencies.length; i < len; i++){
-                    if (entity.getComponent(invDependencies[i])) {
-                        throw "Should remove " + invDependencies[i].name + " before adding " + type.name;
+                for(var i1 = 0, len = invDependencies.length; i1 < len; i1++){
+                    if (entity.getComponent(invDependencies[i1])) {
+                        throw "Should remove " + invDependencies[i1].name + " before remove " + type.name;
                     }
                 }
             }
@@ -6105,7 +6141,7 @@ function dependentComponents(componentOrComponents, dependentMode) {
     _inherits(Transform, Component);
     function Transform(entity) {
         var _this;
-        _this = Component.call(this, entity) || this, _this._position = new engineMath.Vector3(), _this._rotation = new engineMath.Vector3(), _this._rotationQuaternion = new engineMath.Quaternion(), _this._scale = new engineMath.Vector3(1, 1, 1), _this._worldPosition = new engineMath.Vector3(), _this._worldRotation = new engineMath.Vector3(), _this._worldRotationQuaternion = new engineMath.Quaternion(), _this._lossyWorldScale = new engineMath.Vector3(1, 1, 1), _this._localMatrix = new engineMath.Matrix(), _this._worldMatrix = new engineMath.Matrix(), _this._worldForward = null, _this._worldRight = null, _this._worldUp = null, _this._isParentDirty = true, _this._parentTransformCache = null, _this._dirtyFlag = 188, /** @internal */ _this._updateFlagManager = new UpdateFlagManager();
+        _this = Component.call(this, entity) || this, _this._position = new engineMath.Vector3(), _this._rotation = new engineMath.Vector3(), _this._rotationQuaternion = new engineMath.Quaternion(), _this._scale = new engineMath.Vector3(1, 1, 1), _this._localUniformScaling = true, _this._worldPosition = new engineMath.Vector3(), _this._worldRotation = new engineMath.Vector3(), _this._worldRotationQuaternion = new engineMath.Quaternion(), _this._worldUniformScaling = true, _this._lossyWorldScale = new engineMath.Vector3(1, 1, 1), _this._localMatrix = new engineMath.Matrix(), _this._worldMatrix = new engineMath.Matrix(), _this._worldForward = null, _this._worldRight = null, _this._worldUp = null, _this._isParentDirty = true, _this._parentTransformCache = null, _this._dirtyFlag = 188;
         _this._onPositionChanged = _this._onPositionChanged.bind(_this);
         _this._onWorldPositionChanged = _this._onWorldPositionChanged.bind(_this);
         _this._onRotationChanged = _this._onRotationChanged.bind(_this);
@@ -6253,16 +6289,10 @@ function dependentComponents(componentOrComponents, dependentMode) {
         rotMat.getRotation(this._worldRotationQuaternion);
     };
     /**
-   * Register world transform change flag.
-   * @returns Change flag
-   */ _proto.registerWorldChangeFlag = function registerWorldChangeFlag() {
-        return this._updateFlagManager.createFlag(BoolUpdateFlag);
-    };
-    /**
    * @internal
    */ _proto._parentChange = function _parentChange() {
         this._isParentDirty = true;
-        this._updateAllWorldFlag();
+        this._updateAllWorldFlag(444);
     };
     /**
    * @internal
@@ -6273,6 +6303,13 @@ function dependentComponents(componentOrComponents, dependentMode) {
         scale.z < 0 && (isInvert = !isInvert);
         return isInvert;
     };
+    /**
+   * @internal
+   */ _proto._copyFrom = function _copyFrom(transform) {
+        this._position.copyFrom(transform.position);
+        this._rotation.copyFrom(transform.rotation);
+        this._scale.copyFrom(transform.scale);
+    };
     _proto._onDestroy = function _onDestroy() {
         Component.prototype._onDestroy.call(this);
         //@ts-ignore
@@ -6297,10 +6334,10 @@ function dependentComponents(componentOrComponents, dependentMode) {
    */ _proto._updateWorldPositionFlag = function _updateWorldPositionFlag() {
         if (!this._isContainDirtyFlags(132)) {
             this._worldAssociatedChange(132);
-            var nodeChildren = this._entity._children;
-            for(var i = 0, n = nodeChildren.length; i < n; i++){
-                var _nodeChildren_i_transform;
-                (_nodeChildren_i_transform = nodeChildren[i].transform) == null ? void 0 : _nodeChildren_i_transform._updateWorldPositionFlag();
+            var children = this._entity._children;
+            for(var i = 0, n = children.length; i < n; i++){
+                var _children_i_transform;
+                (_children_i_transform = children[i].transform) == null ? void 0 : _children_i_transform._updateWorldPositionFlag();
             }
         }
     };
@@ -6309,14 +6346,19 @@ function dependentComponents(componentOrComponents, dependentMode) {
    * Get worldPosition: Will trigger the worldMatrix, local position update of itself and the worldMatrix update of all parent entities.
    * Get worldRotationQuaternion: Will trigger the world rotation (in quaternion) update of itself and all parent entities.
    * Get worldRotation: Will trigger the world rotation(in euler and quaternion) update of itself and world rotation(in quaternion) update of all parent entities.
+   * Get worldScale: Will trigger the scaling update of itself and all parent entities.
    * In summary, any update of related variables will cause the dirty mark of one of the full process (worldMatrix or worldRotationQuaternion) to be false.
    */ _proto._updateWorldRotationFlag = function _updateWorldRotationFlag() {
-        if (!this._isContainDirtyFlags(152)) {
-            this._worldAssociatedChange(152);
-            var nodeChildren = this._entity._children;
-            for(var i = 0, n = nodeChildren.length; i < n; i++){
-                var _nodeChildren_i_transform;
-                (_nodeChildren_i_transform = nodeChildren[i].transform) == null ? void 0 : _nodeChildren_i_transform._updateWorldPositionAndRotationFlag(); // Rotation update of parent entity will trigger world position and rotation update of all child entity.
+        var parent = this._getParentTransform();
+        var parentWorldUniformScaling = parent ? parent._getWorldUniformScaling() : true;
+        var flags = parentWorldUniformScaling ? 152 : 184;
+        if (!this._isContainDirtyFlags(flags)) {
+            this._worldAssociatedChange(flags);
+            flags = this._getWorldUniformScaling() ? 156 : 188;
+            var children = this._entity._children;
+            for(var i = 0, n = children.length; i < n; i++){
+                var _children_i_transform;
+                (_children_i_transform = children[i].transform) == null ? void 0 : _children_i_transform._updateWorldPositionAndRotationFlag(flags); // Rotation update of parent entity will trigger world position, rotation and scale update of all child entity.
             }
         }
     };
@@ -6325,14 +6367,17 @@ function dependentComponents(componentOrComponents, dependentMode) {
    * Get worldPosition: Will trigger the worldMatrix, local position update of itself and the worldMatrix update of all parent entities.
    * Get worldRotationQuaternion: Will trigger the world rotation (in quaternion) update of itself and all parent entities.
    * Get worldRotation: Will trigger the world rotation(in euler and quaternion) update of itself and world rotation(in quaternion) update of all parent entities.
+   * Get worldScale: Will trigger the scaling update of itself and all parent entities.
    * In summary, any update of related variables will cause the dirty mark of one of the full process (worldMatrix or worldRotationQuaternion) to be false.
-   */ _proto._updateWorldPositionAndRotationFlag = function _updateWorldPositionAndRotationFlag() {
-        if (!this._isContainDirtyFlags(156)) {
-            this._worldAssociatedChange(156);
-            var nodeChildren = this._entity._children;
-            for(var i = 0, n = nodeChildren.length; i < n; i++){
-                var _nodeChildren_i_transform;
-                (_nodeChildren_i_transform = nodeChildren[i].transform) == null ? void 0 : _nodeChildren_i_transform._updateWorldPositionAndRotationFlag();
+   * @param flags - Dirty flag
+   */ _proto._updateWorldPositionAndRotationFlag = function _updateWorldPositionAndRotationFlag(flags) {
+        if (!this._isContainDirtyFlags(flags)) {
+            this._worldAssociatedChange(flags);
+            flags = this._getWorldUniformScaling() ? 156 : 188;
+            var children = this._entity._children;
+            for(var i = 0, n = children.length; i < n; i++){
+                var _children_i_transform;
+                (_children_i_transform = children[i].transform) == null ? void 0 : _children_i_transform._updateWorldPositionAndRotationFlag(flags);
             }
         }
     };
@@ -6341,13 +6386,15 @@ function dependentComponents(componentOrComponents, dependentMode) {
    * Get worldPosition: Will trigger the worldMatrix, local position update of itself and the worldMatrix update of all parent entities.
    * Get worldScale: Will trigger the scaling update of itself and all parent entities.
    * In summary, any update of related variables will cause the dirty mark of one of the full process (worldMatrix) to be false.
-   */ _proto._updateWorldScaleFlag = function _updateWorldScaleFlag() {
-        if (!this._isContainDirtyFlags(160)) {
-            this._worldAssociatedChange(160);
-            var nodeChildren = this._entity._children;
-            for(var i = 0, n = nodeChildren.length; i < n; i++){
-                var _nodeChildren_i_transform;
-                (_nodeChildren_i_transform = nodeChildren[i].transform) == null ? void 0 : _nodeChildren_i_transform._updateWorldPositionAndScaleFlag();
+   * @param flags - Dirty flag
+   */ _proto._updateWorldScaleFlag = function _updateWorldScaleFlag(flags) {
+        if (!this._isContainDirtyFlags(flags)) {
+            this._worldAssociatedChange(flags);
+            flags |= 4;
+            var children = this._entity._children;
+            for(var i = 0, n = children.length; i < n; i++){
+                var _children_i_transform;
+                (_children_i_transform = children[i].transform) == null ? void 0 : _children_i_transform._updateWorldPositionAndScaleFlag(flags);
             }
         }
     };
@@ -6356,25 +6403,27 @@ function dependentComponents(componentOrComponents, dependentMode) {
    * Get worldPosition: Will trigger the worldMatrix, local position update of itself and the worldMatrix update of all parent entities.
    * Get worldScale: Will trigger the scaling update of itself and all parent entities.
    * In summary, any update of related variables will cause the dirty mark of one of the full process (worldMatrix) to be false.
-   */ _proto._updateWorldPositionAndScaleFlag = function _updateWorldPositionAndScaleFlag() {
-        if (!this._isContainDirtyFlags(164)) {
-            this._worldAssociatedChange(164);
-            var nodeChildren = this._entity._children;
-            for(var i = 0, n = nodeChildren.length; i < n; i++){
-                var _nodeChildren_i_transform;
-                (_nodeChildren_i_transform = nodeChildren[i].transform) == null ? void 0 : _nodeChildren_i_transform._updateWorldPositionAndScaleFlag();
+   * @param flags - Dirty flag
+   */ _proto._updateWorldPositionAndScaleFlag = function _updateWorldPositionAndScaleFlag(flags) {
+        if (!this._isContainDirtyFlags(flags)) {
+            this._worldAssociatedChange(flags);
+            var children = this._entity._children;
+            for(var i = 0, n = children.length; i < n; i++){
+                var _children_i_transform;
+                (_children_i_transform = children[i].transform) == null ? void 0 : _children_i_transform._updateWorldPositionAndScaleFlag(flags);
             }
         }
     };
     /**
    * Update all world transform property dirty flag, the principle is the same as above.
-   */ _proto._updateAllWorldFlag = function _updateAllWorldFlag() {
-        if (!this._isContainDirtyFlags(188)) {
-            this._worldAssociatedChange(188);
-            var nodeChildren = this._entity._children;
-            for(var i = 0, n = nodeChildren.length; i < n; i++){
-                var _nodeChildren_i_transform;
-                (_nodeChildren_i_transform = nodeChildren[i].transform) == null ? void 0 : _nodeChildren_i_transform._updateAllWorldFlag();
+   * @param flags - Dirty flag
+   */ _proto._updateAllWorldFlag = function _updateAllWorldFlag(flags) {
+        if (!this._isContainDirtyFlags(flags)) {
+            this._worldAssociatedChange(flags);
+            var children = this._entity._children;
+            for(var i = 0, n = children.length; i < n; i++){
+                var _children_i_transform;
+                (_children_i_transform = children[i].transform) == null ? void 0 : _children_i_transform._updateAllWorldFlag(flags);
             }
         }
     };
@@ -6422,7 +6471,7 @@ function dependentComponents(componentOrComponents, dependentMode) {
     };
     _proto._worldAssociatedChange = function _worldAssociatedChange(type) {
         this._dirtyFlag |= type;
-        this._updateFlagManager.dispatch(128);
+        this._entity._updateFlagManager.dispatch(type);
     };
     _proto._rotateByQuat = function _rotateByQuat(rotateQuat, relativeToLocal) {
         if (relativeToLocal) {
@@ -6491,8 +6540,36 @@ function dependentComponents(componentOrComponents, dependentMode) {
         this._setDirtyFlagFalse(16);
     };
     _proto._onScaleChanged = function _onScaleChanged() {
+        var _this__scale = this._scale, x = _this__scale.x, y = _this__scale.y, z = _this__scale.z;
         this._setDirtyFlagTrue(64);
-        this._updateWorldScaleFlag();
+        var localUniformScaling = x == y && y == z;
+        if (this._localUniformScaling !== localUniformScaling) {
+            this._localUniformScaling = localUniformScaling;
+            this._updateWorldScaleFlag(416);
+        } else {
+            this._updateWorldScaleFlag(160);
+        }
+    };
+    _proto._getWorldUniformScaling = function _getWorldUniformScaling() {
+        if (this._isContainDirtyFlag(256)) {
+            var localUniformScaling = this._localUniformScaling;
+            if (localUniformScaling) {
+                var parent = this._getParentTransform();
+                this._worldUniformScaling = localUniformScaling && (parent ? parent._getWorldUniformScaling() : true);
+            } else {
+                this._worldUniformScaling = false;
+            }
+            this._setDirtyFlagFalse(256);
+        }
+        return this._worldUniformScaling;
+    };
+    //--------------------------------------------------------------deprecated----------------------------------------------------------------
+    /**
+   * @deprecated
+   * Listen for changes in the world pose of this `Entity`.
+   * @returns Change flag
+   */ _proto.registerWorldChangeFlag = function registerWorldChangeFlag() {
+        return this.entity._updateFlagManager.createFlag(BoolUpdateFlag);
     };
     _create_class(Transform, [
         {
@@ -6659,11 +6736,12 @@ function dependentComponents(componentOrComponents, dependentMode) {
             key: "lossyWorldScale",
             get: /**
    * Local lossy scaling.
-   * @remarks The value obtained may not be correct under certain conditions(for example, the parent node has scaling,
-   * and the child node has a rotation), the scaling will be tilted. Vector3 cannot be used to correctly represent the scaling. Must use Matrix3x3.
+   * @remarks The value obtained may not be correct under certain conditions(for example, the parent node has non-uniform world scaling,
+   * and the child node has a rotation), the scaling will be tilted.
    */ function get() {
                 if (this._isContainDirtyFlag(32)) {
                     if (this._getParentTransform()) {
+                        // Vector3 cannot be used to correctly represent the scaling. Must use Matrix3x3
                         var scaleMat = this._getScaleMatrix();
                         var e = scaleMat.elements;
                         this._lossyWorldScale.set(e[0], e[4], e[8]);
@@ -6691,18 +6769,25 @@ function dependentComponents(componentOrComponents, dependentMode) {
                 if (this._localMatrix !== value) {
                     this._localMatrix.copyFrom(value);
                 }
+                var _this = this, position = _this._position, rotationQuaternion = _this._rotationQuaternion, scale = _this._scale;
                 // @ts-ignore
-                this._position._onValueChanged = this._rotationQuaternion._onValueChanged = this._scale._onValueChanged = null;
-                this._localMatrix.decompose(this._position, this._rotationQuaternion, this._scale);
+                position._onValueChanged = rotationQuaternion._onValueChanged = scale._onValueChanged = null;
+                this._localMatrix.decompose(position, rotationQuaternion, scale);
                 // @ts-ignore
-                this._position._onValueChanged = this._onPositionChanged;
+                position._onValueChanged = this._onPositionChanged;
                 // @ts-ignore
-                this._rotationQuaternion._onValueChanged = this._onRotationQuaternionChanged;
+                rotationQuaternion._onValueChanged = this._onRotationQuaternionChanged;
                 // @ts-ignore
-                this._scale._onValueChanged = this._onScaleChanged;
+                scale._onValueChanged = this._onScaleChanged;
                 this._setDirtyFlagTrue(1);
                 this._setDirtyFlagFalse(64 | 2);
-                this._updateAllWorldFlag();
+                var localUniformScaling = scale.x === scale.y && scale.y === scale.z;
+                if (this._localUniformScaling !== localUniformScaling) {
+                    this._localUniformScaling = localUniformScaling;
+                    this._updateAllWorldFlag(444);
+                } else {
+                    this._updateAllWorldFlag(188);
+                }
             }
         },
         {
@@ -6794,6 +6879,9 @@ __decorate([
 __decorate([
     deepClone
 ], Transform.prototype, "_scale", void 0);
+__decorate([
+    assignmentClone
+], Transform.prototype, "_localUniformScaling", void 0);
 __decorate([
     deepClone
 ], Transform.prototype, "_worldPosition", void 0);
@@ -6803,6 +6891,9 @@ __decorate([
 __decorate([
     deepClone
 ], Transform.prototype, "_worldRotationQuaternion", void 0);
+__decorate([
+    assignmentClone
+], Transform.prototype, "_worldUniformScaling", void 0);
 __decorate([
     deepClone
 ], Transform.prototype, "_lossyWorldScale", void 0);
@@ -6827,9 +6918,6 @@ __decorate([
 __decorate([
     ignoreClone
 ], Transform.prototype, "_parentTransformCache", void 0);
-__decorate([
-    ignoreClone
-], Transform.prototype, "_updateFlagManager", void 0);
 __decorate([
     ignoreClone
 ], Transform.prototype, "_onPositionChanged", null);
@@ -6862,12 +6950,18 @@ __decorate([
     TransformModifyFlags[TransformModifyFlags["WorldScale"] = 32] = "WorldScale";
     TransformModifyFlags[TransformModifyFlags["LocalMatrix"] = 64] = "LocalMatrix";
     TransformModifyFlags[TransformModifyFlags["WorldMatrix"] = 128] = "WorldMatrix";
+    /** This is an internal flag used to assist in determining the dispatch
+   *  of world scaling dirty flags in the case of non-uniform scaling.
+   */ TransformModifyFlags[TransformModifyFlags["IsWorldUniformScaling"] = 256] = "IsWorldUniformScaling";
     /** WorldMatrix | WorldPosition */ TransformModifyFlags[TransformModifyFlags["WmWp"] = 132] = "WmWp";
     /** WorldMatrix | WorldEuler | WorldQuat */ TransformModifyFlags[TransformModifyFlags["WmWeWq"] = 152] = "WmWeWq";
+    /** WorldMatrix | WorldEuler | WorldQuat | WorldScale*/ TransformModifyFlags[TransformModifyFlags["WmWeWqWs"] = 184] = "WmWeWqWs";
     /** WorldMatrix | WorldPosition | WorldEuler | WorldQuat */ TransformModifyFlags[TransformModifyFlags["WmWpWeWq"] = 156] = "WmWpWeWq";
     /** WorldMatrix | WorldScale */ TransformModifyFlags[TransformModifyFlags["WmWs"] = 160] = "WmWs";
+    /** WorldMatrix | WorldScale | WorldUniformScaling */ TransformModifyFlags[TransformModifyFlags["WmWsWus"] = 416] = "WmWsWus";
     /** WorldMatrix | WorldPosition | WorldScale */ TransformModifyFlags[TransformModifyFlags["WmWpWs"] = 164] = "WmWpWs";
     /** WorldMatrix | WorldPosition | WorldEuler | WorldQuat | WorldScale */ TransformModifyFlags[TransformModifyFlags["WmWpWeWqWs"] = 188] = "WmWpWeWqWs";
+    /** WorldMatrix | WorldPosition | WorldEuler | WorldQuat | WorldScale | WorldUniformScaling */ TransformModifyFlags[TransformModifyFlags["WmWpWeWqWsWus"] = 444] = "WmWpWeWqWsWus";
     return TransformModifyFlags;
 }({});
 
@@ -6922,7 +7016,7 @@ exports.Renderer = /*#__PURE__*/ function(Component) {
         _this._overrideUpdate = _this.update !== prototype.update;
         _this._addResourceReferCount(_this.shaderData, 1);
         _this._onTransformChanged = _this._onTransformChanged.bind(_this);
-        _this._setTransform(entity.transform);
+        _this._setTransformEntity(entity);
         shaderData.enableMacro(Renderer._receiveShadowMacro);
         shaderData.setVector4(Renderer._rendererLayerProperty, _this._rendererLayer);
         return _this;
@@ -7048,7 +7142,7 @@ exports.Renderer = /*#__PURE__*/ function(Component) {
    * @internal
    */ _proto._onDestroy = function _onDestroy() {
         Component.prototype._onDestroy.call(this);
-        this._setTransform(null);
+        this._setTransformEntity(null);
         this._addResourceReferCount(this.shaderData, -1);
         var materials = this._materials;
         for(var i = 0, n = materials.length; i < n; i++){
@@ -7070,7 +7164,7 @@ exports.Renderer = /*#__PURE__*/ function(Component) {
     /**
    * @internal
    */ _proto._updateTransformShaderData = function _updateTransformShaderData(context, onlyMVP, batched) {
-        var worldMatrix = this._transform.worldMatrix;
+        var worldMatrix = this._transformEntity.transform.worldMatrix;
         if (onlyMVP) {
             this._updateProjectionRelatedShaderData(context, worldMatrix, batched);
         } else {
@@ -7109,7 +7203,7 @@ exports.Renderer = /*#__PURE__*/ function(Component) {
             engineMath.Matrix.invert(mvMatrix, mvInvMatrix);
             engineMath.Matrix.invert(worldMatrix, normalMatrix);
             normalMatrix.transpose();
-            shaderData.setMatrix(Renderer._localMatrixProperty, this._transform.localMatrix);
+            shaderData.setMatrix(Renderer._localMatrixProperty, this._transformEntity.transform.localMatrix);
             shaderData.setMatrix(Renderer._worldMatrixProperty, worldMatrix);
             shaderData.setMatrix(Renderer._mvMatrixProperty, mvMatrix);
             shaderData.setMatrix(Renderer._mvInvMatrixProperty, mvInvMatrix);
@@ -7128,11 +7222,13 @@ exports.Renderer = /*#__PURE__*/ function(Component) {
     };
     /**
    * @internal
-   */ _proto._setTransform = function _setTransform(transform) {
-        var _this__transform;
-        (_this__transform = this._transform) == null ? void 0 : _this__transform._updateFlagManager.removeListener(this._onTransformChanged);
-        transform == null ? void 0 : transform._updateFlagManager.addListener(this._onTransformChanged);
-        this._transform = transform;
+   */ _proto._setTransformEntity = function _setTransformEntity(entity) {
+        var preEntity = this._transformEntity;
+        if (entity !== preEntity) {
+            preEntity == null ? void 0 : preEntity._updateFlagManager.removeListener(this._onTransformChanged);
+            entity == null ? void 0 : entity._updateFlagManager.addListener(this._onTransformChanged);
+            this._transformEntity = entity;
+        }
     };
     /**
    * @internal
@@ -7283,6 +7379,9 @@ __decorate([
 __decorate([
     ignoreClone
 ], exports.Renderer.prototype, "_batchedTransformShaderData", void 0);
+__decorate([
+    ignoreClone
+], exports.Renderer.prototype, "_transformEntity", void 0);
 __decorate([
     ignoreClone
 ], exports.Renderer.prototype, "_overrideUpdate", void 0);
@@ -7295,9 +7394,6 @@ __decorate([
 __decorate([
     ignoreClone
 ], exports.Renderer.prototype, "_rendererLayer", void 0);
-__decorate([
-    ignoreClone
-], exports.Renderer.prototype, "_transform", void 0);
 __decorate([
     deepClone
 ], exports.Renderer.prototype, "_shaderData", void 0);
@@ -8705,11 +8801,13 @@ __decorate([
    * @param viewport - Viewport
    * @param material - The material to use when blitting
    * @param passIndex - Pass index to use of the provided material
-   */ PipelineUtils.blitTexture = function blitTexture(engine, source, destination, mipLevel, viewport, material, passIndex) {
+   * @param flipYOfSource - Whether flip Y axis of source texture
+   */ PipelineUtils.blitTexture = function blitTexture(engine, source, destination, mipLevel, viewport, material, passIndex, flipYOfSource) {
         if (mipLevel === void 0) mipLevel = 0;
         if (viewport === void 0) viewport = PipelineUtils.defaultViewport;
         if (material === void 0) material = null;
         if (passIndex === void 0) passIndex = 0;
+        if (flipYOfSource === void 0) flipYOfSource = false;
         var basicResources = engine._basicResources;
         var blitMesh = destination ? basicResources.flipYBlitMesh : basicResources.blitMesh;
         var blitMaterial = material || basicResources.blitMaterial;
@@ -8723,9 +8821,15 @@ __decorate([
         rendererShaderData.setFloat(PipelineUtils._blitMipLevelProperty, mipLevel);
         PipelineUtils._texelSize.set(1 / source.width, 1 / source.height, source.width, source.height);
         rendererShaderData.setVector4(PipelineUtils._blitTexelSizeProperty, PipelineUtils._texelSize);
+        if (flipYOfSource) {
+            rendererShaderData.enableMacro(PipelineUtils._flipYTextureMacro);
+        } else {
+            rendererShaderData.disableMacro(PipelineUtils._flipYTextureMacro);
+        }
         var pass = blitMaterial.shader.subShaders[0].passes[passIndex];
         var compileMacros = Shader._compileMacros;
-        ShaderMacroCollection.unionCollection(context.camera._globalShaderMacro, blitMaterial.shaderData._macroCollection, compileMacros);
+        ShaderMacroCollection.unionCollection(context.camera._globalShaderMacro, rendererShaderData._macroCollection, compileMacros);
+        ShaderMacroCollection.unionCollection(compileMacros, blitMaterial.shaderData._macroCollection, compileMacros);
         var program = pass._getShaderProgram(engine, compileMacros);
         program.bind();
         program.groupingOtherUniformBlock();
@@ -8741,6 +8845,7 @@ PipelineUtils._blitTextureProperty = ShaderProperty.getByName("renderer_BlitText
 PipelineUtils._blitMipLevelProperty = ShaderProperty.getByName("renderer_BlitMipLevel");
 PipelineUtils._blitTexelSizeProperty = ShaderProperty.getByName("renderer_texelSize") // x: 1/width, y: 1/height, z: width, w: height
 ;
+PipelineUtils._flipYTextureMacro = ShaderMacro.getByName("renderer_FlipYBlitTexture");
 PipelineUtils._rendererShaderData = new ShaderData(ShaderDataGroup.Renderer);
 PipelineUtils._texelSize = new engineMath.Vector4();
 PipelineUtils.defaultViewport = new engineMath.Vector4(0, 0, 1, 1);
@@ -8845,13 +8950,11 @@ exports.Camera = /*#__PURE__*/ function(Component) {
    */ _this.opaqueTextureDownsampling = Downsampling.TwoX, /**
    * Multi-sample anti-aliasing samples when use independent canvas mode.
    *
-   * @remarks The `independentCanvasEnabled` property should be `true` to take effect, otherwise it will be invalid.
+   * @remarks It will take effect when `independentCanvasEnabled` property is `true`, otherwise it will be invalid.
    */ _this.msaaSamples = MSAASamples.None, /** @internal */ _this._cameraType = CameraType.Normal, /** @internal */ _this._globalShaderMacro = new ShaderMacroCollection(), /** @internal */ _this._frustum = new engineMath.BoundingFrustum(), /** @internal */ _this._virtualCamera = new VirtualCamera(), /** @internal */ _this._replacementShader = null, /** @internal */ _this._replacementSubShaderTag = null, /** @internal */ _this._replacementFailureStrategy = null, /** @internal */ _this._cameraIndex = -1, _this._priority = 0, _this._shaderData = new ShaderData(ShaderDataGroup.Camera), _this._isCustomViewMatrix = false, _this._isCustomProjectionMatrix = false, _this._fieldOfView = 45, _this._orthographicSize = 10, _this._isProjectionDirty = true, _this._isInvProjMatDirty = true, _this._customAspectRatio = undefined, _this._renderTarget = null, _this._depthBufferParams = new engineMath.Vector4(), _this._opaqueTextureEnabled = false, _this._enableHDR = false, _this._enablePostProcess = false, _this._viewport = new engineMath.Vector4(0, 0, 1, 1), _this._pixelViewport = new engineMath.Rect(0, 0, 0, 0), _this._inverseProjectionMatrix = new engineMath.Matrix(), _this._invViewProjMat = new engineMath.Matrix();
-        var transform = _this.entity.transform;
-        _this._transform = transform;
-        _this._isViewMatrixDirty = transform.registerWorldChangeFlag();
-        _this._isInvViewProjDirty = transform.registerWorldChangeFlag();
-        _this._frustumChangeFlag = transform.registerWorldChangeFlag();
+        _this._isViewMatrixDirty = entity.registerWorldChangeFlag();
+        _this._isInvViewProjDirty = entity.registerWorldChangeFlag();
+        _this._frustumChangeFlag = entity.registerWorldChangeFlag();
         _this._renderPipeline = new BasicRenderPipeline(_this);
         _this._addResourceReferCount(_this.shaderData, 1);
         _this._updatePixelViewport();
@@ -8998,7 +9101,7 @@ exports.Camera = /*#__PURE__*/ function(Component) {
         var engine = this._engine;
         var context = engine._renderContext;
         var virtualCamera = this._virtualCamera;
-        var transform = this.entity.transform;
+        var transform = this._entity.transform;
         engineMath.Matrix.multiply(this.projectionMatrix, this.viewMatrix, virtualCamera.viewProjectionMatrix);
         virtualCamera.position.copyFrom(transform.worldPosition);
         if (virtualCamera.isOrthographic) {
@@ -9076,7 +9179,6 @@ exports.Camera = /*#__PURE__*/ function(Component) {
         this._virtualCamera = null;
         this._shaderData = null;
         this._frustumChangeFlag = null;
-        this._transform = null;
         this._isViewMatrixDirty = null;
         this._isInvViewProjDirty = null;
         this._viewport = null;
@@ -9118,7 +9220,7 @@ exports.Camera = /*#__PURE__*/ function(Component) {
     };
     _proto._updateShaderData = function _updateShaderData() {
         var shaderData = this.shaderData;
-        var transform = this._transform;
+        var transform = this._entity.transform;
         shaderData.setMatrix(Camera._inverseViewMatrixProperty, transform.worldMatrix);
         shaderData.setVector3(Camera._cameraPositionProperty, transform.worldPosition);
         shaderData.setVector3(Camera._cameraForwardProperty, transform.worldForward);
@@ -9133,7 +9235,7 @@ exports.Camera = /*#__PURE__*/ function(Component) {
    */ _proto._getInvViewProjMat = function _getInvViewProjMat() {
         if (this._isInvViewProjDirty.flag) {
             this._isInvViewProjDirty.flag = false;
-            engineMath.Matrix.multiply(this._transform.worldMatrix, this._getInverseProjectionMatrix(), this._invViewProjMat);
+            engineMath.Matrix.multiply(this._entity.transform.worldMatrix, this._getInverseProjectionMatrix(), this._invViewProjMat);
         }
         return this._invViewProjMat;
     };
@@ -9180,13 +9282,17 @@ exports.Camera = /*#__PURE__*/ function(Component) {
             key: "independentCanvasEnabled",
             get: /**
    * Whether independent canvas is enabled.
-   *
    * @remarks If true, the msaa in viewport can turn or off independently by `msaaSamples` property.
    */ function get() {
-                if (this.enableHDR || this.enablePostProcess && this.scene._postProcessManager.hasActiveEffect) {
+                // Uber pass need internal RT
+                if (this.enablePostProcess && this.scene._postProcessManager.hasActiveEffect) {
                     return true;
                 }
-                return this.opaqueTextureEnabled && !this._renderTarget;
+                if (this.enableHDR || this.opaqueTextureEnabled) {
+                    var _this_renderTarget;
+                    return this._getInternalColorTextureFormat() !== ((_this_renderTarget = this.renderTarget) == null ? void 0 : _this_renderTarget.getColorTexture(0).format);
+                }
+                return false;
             }
         },
         {
@@ -9328,7 +9434,7 @@ exports.Camera = /*#__PURE__*/ function(Component) {
                 }
                 this._isViewMatrixDirty.flag = false;
                 // Ignore scale
-                var transform = this._transform;
+                var transform = this._entity.transform;
                 engineMath.Matrix.rotationTranslation(transform.worldRotationQuaternion, transform.worldPosition, viewMatrix);
                 viewMatrix.invert();
                 return viewMatrix;
@@ -9446,9 +9552,6 @@ __decorate([
 __decorate([
     ignoreClone
 ], exports.Camera.prototype, "_frustumChangeFlag", void 0);
-__decorate([
-    ignoreClone
-], exports.Camera.prototype, "_transform", void 0);
 __decorate([
     ignoreClone
 ], exports.Camera.prototype, "_isViewMatrixDirty", void 0);
@@ -9635,9 +9738,21 @@ RenderContext._flipYViewProjectionMatrix = new engineMath.Matrix();
                 if (shaderPass.getTagValue(pipelineStageKey) !== pipelineStageTagValue) {
                     continue;
                 }
-                if (!needMaskType) {
-                    var _shaderPass__renderState;
-                    if (((_shaderPass__renderState = shaderPass._renderState) != null ? _shaderPass__renderState : renderStates[j]).renderQueueType !== renderQueueType) {
+                var renderState = shaderPass._renderState;
+                if (needMaskType) {
+                    // Mask don't care render queue type
+                    if (!renderState) {
+                        renderState = renderStates[j];
+                    }
+                } else {
+                    var passQueueType = void 0;
+                    if (renderState) {
+                        passQueueType = renderState._getRenderQueueByShaderData(shaderPass._renderStateDataMap, materialData);
+                    } else {
+                        renderState = renderStates[j];
+                        passQueueType = renderState.renderQueueType;
+                    }
+                    if (passQueueType !== renderQueueType) {
                         continue;
                     }
                 }
@@ -9692,9 +9807,7 @@ RenderContext._flipYViewProjectionMatrix = new engineMath.Matrix();
                         program.uploadUnGroupTextures();
                     }
                 }
-                var _shaderPass__renderState1;
-                var renderState = (_shaderPass__renderState1 = shaderPass._renderState) != null ? _shaderPass__renderState1 : renderStates[j];
-                renderState._applyStates(engine, renderer.entity.transform._isFrontFaceInvert(), shaderPass._renderStateDataMap, material.shaderData, customStates);
+                renderState._applyStates(engine, renderer._transformEntity.transform._isFrontFaceInvert(), shaderPass._renderStateDataMap, material.shaderData, customStates);
                 rhi.drawPrimitive(primitive, subElement.subPrimitive, program);
             }
         }
@@ -10554,6 +10667,8 @@ CascadedShadowCasterPass._tempMatrix0 = new engineMath.Matrix();
     function BasicRenderPipeline(camera) {
         this._lastCanvasSize = new engineMath.Vector2();
         this._internalColorTarget = null;
+        this._canUseBlitFrameBuffer = false;
+        this._shouldGrabColor = false;
         this._camera = camera;
         var engine = camera.engine;
         this._cullingResults = new CullingResults();
@@ -10578,10 +10693,19 @@ CascadedShadowCasterPass._tempMatrix0 = new engineMath.Matrix();
         context.rendererUpdateFlag = ContextRendererUpdateFlag.All;
         var camera = this._camera;
         var scene = camera.scene, engine = camera.engine;
+        var rhi = engine._hardwareRenderer;
         var cullingResults = this._cullingResults;
         var sunlight = scene._lightManager._sunlight;
         var depthOnlyPass = this._depthOnlyPass;
         var depthPassEnabled = camera.depthTextureMode === DepthTextureMode.PrePass && depthOnlyPass._supportDepthTexture;
+        var finalClearFlags = camera.clearFlags & ~(ignoreClear != null ? ignoreClear : CameraClearFlags.None);
+        var independentCanvasEnabled = camera.independentCanvasEnabled;
+        var msaaSamples = camera.renderTarget ? camera.renderTarget.antiAliasing : camera.msaaSamples;
+        this._shouldGrabColor = independentCanvasEnabled && !(finalClearFlags & CameraClearFlags.Color);
+        // 1. Only support blitFramebuffer in webgl2 context
+        // 2. Can't blit normal FBO to MSAA FBO
+        // 3. Can't blit screen MSAA FBO to normal FBO in mac safari platform and mobile, but mac chrome and firfox is OK
+        this._canUseBlitFrameBuffer = rhi.isWebGL2 && msaaSamples === 1 && (!!camera.renderTarget || !rhi.context.antialias);
         if (scene.castShadows && sunlight && sunlight.shadowType !== ShadowType.None) {
             this._cascadedShadowCasterPass.onRender(context);
             context.rendererUpdateFlag = ContextRendererUpdateFlag.None;
@@ -10601,24 +10725,46 @@ CascadedShadowCasterPass._tempMatrix0 = new engineMath.Matrix();
         } else {
             camera.shaderData.setTexture(exports.Camera._cameraDepthTextureProperty, engine._basicResources.whiteTexture2D);
         }
-        // Check if need to create internal color texture
-        var independentCanvasEnabled = camera.independentCanvasEnabled;
+        // Check if need to create internal color texture or grab texture
         if (independentCanvasEnabled) {
+            var depthFormat;
+            if (camera.renderTarget) {
+                depthFormat = camera.renderTarget._depthFormat;
+            } else if (rhi.context.depth && rhi.context.stencil) {
+                depthFormat = TextureFormat.Depth24Stencil8;
+            } else if (rhi.context.depth) {
+                depthFormat = TextureFormat.Depth24;
+            } else if (rhi.context.stencil) {
+                depthFormat = TextureFormat.Stencil;
+            } else {
+                depthFormat = null;
+            }
             var viewport = camera.pixelViewport;
-            var internalColorTarget = PipelineUtils.recreateRenderTargetIfNeeded(engine, this._internalColorTarget, viewport.width, viewport.height, camera._getInternalColorTextureFormat(), TextureFormat.Depth24Stencil8, false, false, camera.msaaSamples, TextureWrapMode.Clamp, TextureFilterMode.Bilinear);
+            var internalColorTarget = PipelineUtils.recreateRenderTargetIfNeeded(engine, this._internalColorTarget, viewport.width, viewport.height, camera._getInternalColorTextureFormat(), depthFormat, false, false, msaaSamples, TextureWrapMode.Clamp, TextureFilterMode.Bilinear);
+            if (!this._canUseBlitFrameBuffer && this._shouldGrabColor) {
+                var _camera_renderTarget;
+                var _camera_renderTarget_getColorTexture_format;
+                var grabTexture = PipelineUtils.recreateTextureIfNeeded(engine, this._grabTexture, viewport.width, viewport.height, (_camera_renderTarget_getColorTexture_format = (_camera_renderTarget = camera.renderTarget) == null ? void 0 : _camera_renderTarget.getColorTexture(0).format) != null ? _camera_renderTarget_getColorTexture_format : TextureFormat.R8G8B8A8, false, TextureWrapMode.Clamp, TextureFilterMode.Bilinear);
+                this._grabTexture = grabTexture;
+            }
             this._internalColorTarget = internalColorTarget;
         } else {
             var internalColorTarget1 = this._internalColorTarget;
+            var grabTexture1 = this._grabTexture;
             if (internalColorTarget1) {
                 var _internalColorTarget_getColorTexture;
                 (_internalColorTarget_getColorTexture = internalColorTarget1.getColorTexture(0)) == null ? void 0 : _internalColorTarget_getColorTexture.destroy(true);
                 internalColorTarget1.destroy(true);
                 this._internalColorTarget = null;
             }
+            if (grabTexture1) {
+                grabTexture1.destroy(true);
+                this._grabTexture = null;
+            }
         }
-        this._drawRenderPass(context, camera, cubeFace, mipLevel, ignoreClear);
+        this._drawRenderPass(context, camera, finalClearFlags, cubeFace, mipLevel);
     };
-    _proto._drawRenderPass = function _drawRenderPass(context, camera, cubeFace, mipLevel, ignoreClear) {
+    _proto._drawRenderPass = function _drawRenderPass(context, camera, finalClearFlags, cubeFace, mipLevel) {
         var cullingResults = this._cullingResults;
         var opaqueQueue = cullingResults.opaqueQueue, alphaTestQueue = cullingResults.alphaTestQueue, transparentQueue = cullingResults.transparentQueue;
         var engine = camera.engine, scene = camera.scene;
@@ -10634,18 +10780,38 @@ CascadedShadowCasterPass._tempMatrix0 = new engineMath.Matrix();
             context.applyVirtualCamera(camera._virtualCamera, needFlipProjection);
         }
         rhi.activeRenderTarget(colorTarget, colorViewport, context.flipProjection, mipLevel, cubeFace);
-        var clearFlags = camera.clearFlags & ~(ignoreClear != null ? ignoreClear : CameraClearFlags.None);
         var color = background.solidColor;
-        if (clearFlags !== CameraClearFlags.None) {
-            rhi.clearRenderTarget(engine, clearFlags, color);
+        if (internalColorTarget && finalClearFlags !== CameraClearFlags.All) {
+            // Can use `blitFramebuffer` API to copy color/depth/stencil buffer from back buffer to internal RT
+            if (this._canUseBlitFrameBuffer) {
+                finalClearFlags !== CameraClearFlags.None && rhi.clearRenderTarget(engine, finalClearFlags, color);
+                rhi.blitInternalRTByBlitFrameBuffer(camera.renderTarget, internalColorTarget, finalClearFlags, camera.viewport);
+            } else {
+                if (!(finalClearFlags & CameraClearFlags.Depth) || !(finalClearFlags & CameraClearFlags.Stencil)) {
+                    Logger.warn("We clear all depth/stencil state cause of the internalRT can't copy depth/stencil buffer from back buffer when use copy plan");
+                }
+                if (this._shouldGrabColor) {
+                    rhi.clearRenderTarget(engine, CameraClearFlags.DepthStencil);
+                    // Copy RT's color buffer to grab texture
+                    rhi.copyRenderTargetToSubTexture(camera.renderTarget, this._grabTexture, camera.viewport);
+                    // Then blit grab texture to internal RT's color buffer
+                    PipelineUtils.blitTexture(engine, this._grabTexture, internalColorTarget, 0, undefined, undefined, undefined, // Only flip Y axis in webgl context
+                    !camera.renderTarget);
+                } else {
+                    rhi.clearRenderTarget(engine, CameraClearFlags.All, color);
+                }
+            }
+            rhi.activeRenderTarget(colorTarget, colorViewport, context.flipProjection, mipLevel, cubeFace);
+        } else if (finalClearFlags !== CameraClearFlags.None) {
+            rhi.clearRenderTarget(engine, finalClearFlags, color);
         }
         var maskManager = scene._maskManager;
-        if (clearFlags & CameraClearFlags.Stencil) {
+        if (finalClearFlags & CameraClearFlags.Stencil) {
             maskManager.hasStencilWritten = false;
         }
         opaqueQueue.render(context, PipelineStage.Forward);
         alphaTestQueue.render(context, PipelineStage.Forward);
-        if (clearFlags & CameraClearFlags.Color) {
+        if (finalClearFlags & CameraClearFlags.Color) {
             if (background.mode === BackgroundMode.Sky) {
                 background.sky._render(context);
             } else if (background.mode === BackgroundMode.Texture && background.texture) {
@@ -10722,8 +10888,7 @@ CascadedShadowCasterPass._tempMatrix0 = new engineMath.Matrix();
             var shaderPass = shaderPasses[i];
             var renderState = shaderPass._renderState;
             if (renderState) {
-                renderState._applyRenderQueueByShaderData(shaderPass._renderStateDataMap, subRenderElement.material.shaderData);
-                renderQueueType = renderState.renderQueueType;
+                renderQueueType = renderState._getRenderQueueByShaderData(shaderPass._renderStateDataMap, subRenderElement.material.shaderData);
             } else {
                 renderQueueType = renderStates[i].renderQueueType;
             }
@@ -12993,15 +13158,29 @@ PBRBaseMaterial._clearCoatNormalTextureProp = ShaderProperty.getByName("material
     _inherits(PBRMaterial, PBRBaseMaterial);
     function PBRMaterial(engine) {
         var _this;
-        _this = PBRBaseMaterial.call(this, engine, Shader.find("pbr")) || this, _this._anisotropyRotation = 0, _this._iridescenceRange = new engineMath.Vector2(100, 400);
+        _this = PBRBaseMaterial.call(this, engine, Shader.find("pbr")) || this, _this._anisotropyRotation = 0, _this._iridescenceRange = new engineMath.Vector2(100, 400), _this._sheenEnabled = false;
         var shaderData = _this.shaderData;
         shaderData.setFloat(PBRMaterial._metallicProp, 1);
         shaderData.setFloat(PBRMaterial._roughnessProp, 1);
         shaderData.setFloat(PBRMaterial._iorProp, 1.5);
         shaderData.setVector3(PBRMaterial._anisotropyInfoProp, new engineMath.Vector3(1, 0, 0));
         shaderData.setVector4(PBRMaterial._iridescenceInfoProp, new engineMath.Vector4(0, 1.3, 100, 400));
+        var sheenColor = new engineMath.Color(0, 0, 0);
+        shaderData.setColor(PBRMaterial._sheenColorProp, sheenColor);
         // @ts-ignore
         _this._iridescenceRange._onValueChanged = _this._onIridescenceRangeChanged.bind(_this);
+        // @ts-ignore
+        sheenColor._onValueChanged = function() {
+            var enableSheen = sheenColor.r + sheenColor.g + sheenColor.b > 0;
+            if (enableSheen !== _this._sheenEnabled) {
+                _this._sheenEnabled = enableSheen;
+                if (enableSheen) {
+                    _this.shaderData.enableMacro("MATERIAL_ENABLE_SHEEN");
+                } else {
+                    _this.shaderData.disableMacro("MATERIAL_ENABLE_SHEEN");
+                }
+            }
+        };
         return _this;
     }
     var _proto = PBRMaterial.prototype;
@@ -13182,7 +13361,7 @@ PBRBaseMaterial._clearCoatNormalTextureProp = ShaderProperty.getByName("material
             key: "iridescenceThicknessRange",
             get: /**
    * The range of iridescence thickness, x is minimum, y is maximum.
-   *  @defaultValue `[100, 400]`.
+   *  @defaultValue `[100, 400]`
    */ function get() {
                 return this._iridescenceRange;
             },
@@ -13210,6 +13389,67 @@ PBRBaseMaterial._clearCoatNormalTextureProp = ShaderProperty.getByName("material
                     this.shaderData.disableMacro("MATERIAL_HAS_IRIDESCENCE_THICKNESS_TEXTURE");
                 }
             }
+        },
+        {
+            key: "sheenColor",
+            get: /**
+   * Sheen color.
+   * @defaultValue `[0,0,0]`
+   */ function get() {
+                return this.shaderData.getColor(PBRMaterial._sheenColorProp);
+            },
+            set: function set(value) {
+                var sheenColor = this.shaderData.getColor(PBRMaterial._sheenColorProp);
+                if (value !== sheenColor) {
+                    sheenColor.copyFrom(value);
+                }
+            }
+        },
+        {
+            key: "sheenRoughness",
+            get: /**
+   * Sheen roughness, from 0.0 to 1.0.
+   * @defaultValue `0.0`
+   */ function get() {
+                return this.shaderData.getFloat(PBRMaterial._sheenRoughnessProp);
+            },
+            set: function set(value) {
+                value = Math.max(0, Math.min(1, value));
+                this.shaderData.setFloat(PBRMaterial._sheenRoughnessProp, value);
+            }
+        },
+        {
+            key: "sheenColorTexture",
+            get: /**
+   * Sheen color texture, multiply ‘sheenColor’.
+   */ function get() {
+                return this.shaderData.getTexture(PBRMaterial._sheenTextureProp);
+            },
+            set: function set(value) {
+                this.shaderData.setTexture(PBRMaterial._sheenTextureProp, value);
+                if (value) {
+                    this.shaderData.enableMacro("MATERIAL_HAS_SHEEN_TEXTURE");
+                } else {
+                    this.shaderData.disableMacro("MATERIAL_HAS_SHEEN_TEXTURE");
+                }
+            }
+        },
+        {
+            key: "sheenRoughnessTexture",
+            get: /**
+   * Sheen roughness texture.
+   * @remarks Use alpha channel, and multiply 'sheenRoughness'.
+   */ function get() {
+                return this.shaderData.getTexture(PBRMaterial._sheenRoughnessTextureProp);
+            },
+            set: function set(value) {
+                this.shaderData.setTexture(PBRMaterial._sheenRoughnessTextureProp, value);
+                if (value) {
+                    this.shaderData.enableMacro("MATERIAL_HAS_SHEEN_ROUGHNESS_TEXTURE");
+                } else {
+                    this.shaderData.disableMacro("MATERIAL_HAS_SHEEN_ROUGHNESS_TEXTURE");
+                }
+            }
         }
     ]);
     return PBRMaterial;
@@ -13223,6 +13463,10 @@ PBRMaterial._anisotropyTextureProp = ShaderProperty.getByName("material_Anisotro
 PBRMaterial._iridescenceInfoProp = ShaderProperty.getByName("material_IridescenceInfo");
 PBRMaterial._iridescenceThicknessTextureProp = ShaderProperty.getByName("material_IridescenceThicknessTexture");
 PBRMaterial._iridescenceTextureProp = ShaderProperty.getByName("material_IridescenceTexture");
+PBRMaterial._sheenColorProp = ShaderProperty.getByName("material_SheenColor");
+PBRMaterial._sheenRoughnessProp = ShaderProperty.getByName("material_SheenRoughness");
+PBRMaterial._sheenTextureProp = ShaderProperty.getByName("material_SheenTexture");
+PBRMaterial._sheenRoughnessTextureProp = ShaderProperty.getByName("material_SheenRoughnessTexture");
 
 /**
  * PBR (Specular-Glossiness Workflow) Material.
@@ -14022,8 +14266,7 @@ var BlendShapeFrameDirty = /*#__PURE__*/ function(BlendShapeFrameDirty) {
         var mesh = this._mesh;
         if (mesh) {
             var localBounds = mesh.bounds;
-            var worldMatrix = this._entity.transform.worldMatrix;
-            engineMath.BoundingBox.transform(localBounds, worldMatrix, worldBounds);
+            engineMath.BoundingBox.transform(localBounds, this._transformEntity.transform.worldMatrix, worldBounds);
         } else {
             worldBounds.min.set(0, 0, 0);
             worldBounds.max.set(0, 0, 0);
@@ -16922,12 +17165,18 @@ var ComponentCloner = /*#__PURE__*/ function() {
  */ var Entity = /*#__PURE__*/ function(EngineObject) {
     _inherits(Entity, EngineObject);
     function Entity(engine, name) {
+        for(var _len = arguments.length, components = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++){
+            components[_key - 2] = arguments[_key];
+        }
         var _this;
-        _this = EngineObject.call(this, engine) || this, /** The layer the entity belongs to. */ _this.layer = Layer.Layer0, /** @internal */ _this._isActiveInHierarchy = false, /** @internal */ _this._isActiveInScene = false, /** @internal */ _this._components = [], /** @internal */ _this._scripts = new DisorderedArray(), /** @internal */ _this._children = [], /** @internal */ _this._isRoot = false, /** @internal */ _this._isActive = true, /** @internal */ _this._siblingIndex = -1, /** @internal */ _this._isTemplate = false, _this._parent = null, //--------------------------------------------------------------deprecated----------------------------------------------------------------
+        _this = EngineObject.call(this, engine) || this, /** The layer the entity belongs to. */ _this.layer = Layer.Layer0, /** @internal */ _this._isActiveInHierarchy = false, /** @internal */ _this._isActiveInScene = false, /** @internal */ _this._components = [], /** @internal */ _this._scripts = new DisorderedArray(), /** @internal */ _this._children = [], /** @internal */ _this._isRoot = false, /** @internal */ _this._isActive = true, /** @internal */ _this._siblingIndex = -1, /** @internal */ _this._isTemplate = false, /** @internal */ _this._updateFlagManager = new UpdateFlagManager(), _this._parent = null, //--------------------------------------------------------------deprecated----------------------------------------------------------------
         _this._invModelMatrix = new engineMath.Matrix();
         _this.name = name;
-        _this.transform = _this.addComponent(Transform);
-        _this._inverseWorldMatFlag = _this.transform.registerWorldChangeFlag();
+        for(var i = 0, n = components.length; i < n; i++){
+            _this.addComponent(components[i]);
+        }
+        !_this._transform && _this.addComponent(Transform);
+        _this._inverseWorldMatFlag = _this.registerWorldChangeFlag();
         return _this;
     }
     var _proto = Entity.prototype;
@@ -16945,6 +17194,12 @@ var ComponentCloner = /*#__PURE__*/ function() {
             this
         ], args));
         this._components.push(component);
+        // @todo: temporary solution
+        if (_instanceof(component, Transform)) {
+            var transform = this._transform;
+            this._transform = component;
+            transform == null ? void 0 : transform.destroy();
+        }
         component._setActive(true, ActiveChangeFlag.All);
         return component;
     };
@@ -17088,7 +17343,8 @@ var ComponentCloner = /*#__PURE__*/ function() {
    * @param name - The child entity's name
    * @returns The child entity
    */ _proto.createChild = function createChild(name) {
-        var child = new Entity(this.engine, name);
+        var transform = this._transform;
+        var child = transform ? new Entity(this.engine, name, transform.constructor) : new Entity(this.engine, name);
         child.layer = this.layer;
         child.parent = this;
         return child;
@@ -17117,13 +17373,20 @@ var ComponentCloner = /*#__PURE__*/ function() {
         return cloneEntity;
     };
     /**
+   * Listen for changes in the world pose of this `Entity`.
+   * @returns Change flag
+   */ _proto.registerWorldChangeFlag = function registerWorldChangeFlag() {
+        return this._updateFlagManager.createFlag(BoolUpdateFlag);
+    };
+    /**
    * @internal
    */ _proto._markAsTemplate = function _markAsTemplate(templateResource) {
         this._isTemplate = true;
         this._templateResource = templateResource;
     };
     _proto._createCloneEntity = function _createCloneEntity() {
-        var cloneEntity = new Entity(this._engine, this.name);
+        var transform = this._transform;
+        var cloneEntity = transform ? new Entity(this.engine, this.name, transform.constructor) : new Entity(this.engine, this.name);
         var templateResource = this._templateResource;
         if (templateResource) {
             cloneEntity._templateResource = templateResource;
@@ -17131,11 +17394,7 @@ var ComponentCloner = /*#__PURE__*/ function() {
         }
         cloneEntity.layer = this.layer;
         cloneEntity._isActive = this._isActive;
-        var cloneTransform = cloneEntity.transform;
-        var _this = this, srcTransform = _this.transform;
-        cloneTransform.position = srcTransform.position;
-        cloneTransform.rotation = srcTransform.rotation;
-        cloneTransform.scale = srcTransform.scale;
+        cloneEntity.transform._copyFrom(this.transform);
         var srcChildren = this._children;
         for(var i = 0, n = srcChildren.length; i < n; i++){
             cloneEntity.addChild(srcChildren[i]._createCloneEntity());
@@ -17435,6 +17694,14 @@ var ComponentCloner = /*#__PURE__*/ function() {
         return entity;
     };
     _create_class(Entity, [
+        {
+            key: "transform",
+            get: /**
+   * The transform of this entity.
+   */ function get() {
+                return this._transform;
+            }
+        },
         {
             key: "isActive",
             get: /**
@@ -17684,16 +17951,6 @@ var SkinUpdateFlag = /*#__PURE__*/ function(SkinUpdateFlag) {
     var _proto = SkinnedMeshRenderer.prototype;
     /**
    * @internal
-   */ _proto._updateTransformShaderData = function _updateTransformShaderData(context, onlyMVP, batched) {
-        var worldMatrix = this._transform.worldMatrix;
-        if (onlyMVP) {
-            this._updateProjectionRelatedShaderData(context, worldMatrix, batched);
-        } else {
-            this._updateWorldViewRelatedShaderData(context, worldMatrix, batched);
-        }
-    };
-    /**
-   * @internal
    */ _proto._onDestroy = function _onDestroy() {
         var _this__jointTexture;
         MeshRenderer.prototype._onDestroy.call(this);
@@ -17769,7 +18026,7 @@ var SkinUpdateFlag = /*#__PURE__*/ function(SkinUpdateFlag) {
         var _this_skin;
         var rootBone = (_this_skin = this.skin) == null ? void 0 : _this_skin.rootBone;
         if (rootBone) {
-            engineMath.BoundingBox.transform(this._localBounds, this._transform.worldMatrix, worldBounds);
+            engineMath.BoundingBox.transform(this._localBounds, this._transformEntity.transform.worldMatrix, worldBounds);
         } else {
             MeshRenderer.prototype._updateBounds.call(this, worldBounds);
         }
@@ -17810,7 +18067,7 @@ var SkinUpdateFlag = /*#__PURE__*/ function(SkinUpdateFlag) {
                 }
                 break;
             case SkinUpdateFlag.RootBoneChanged:
-                this._setTransform(value.transform);
+                this._setTransformEntity(value);
                 this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                 break;
         }
@@ -18507,7 +18764,8 @@ PrimitiveChunk.subMeshPool = new ReturnableObjectPool(SubMesh, 10);
     /** Scene. */ AssetType["Scene"] = "Scene";
     /** HDR to cube. */ AssetType["HDR"] = "HDR";
     /** Font. */ AssetType["Font"] = "Font";
-    /** Source Font, include ttf、 otf and woff. */ AssetType["SourceFont"] = "SourceFont";
+    /** Source Font, include ttf, otf and woff. */ AssetType["SourceFont"] = "SourceFont";
+    /** AudioClip, include ogg, wav and mp3. */ AssetType["Audio"] = "Audio";
     /** Project asset. */ AssetType["Project"] = "project";
     return AssetType;
 }({});
@@ -18897,9 +19155,10 @@ var defaultRetryCount = 1;
 var defaultTimeout = Infinity;
 var defaultInterval = 500;
 /**
- * Web request.
- * @param url - The link
- * @param config - Load configuration
+ * Sends a request to the specified URL and returns a promise for the response.
+ * @param url - The URL to send the request to
+ * @param config - Configuration options for the request
+ * @returns A promise that resolves with the response of type `T`
  */ function request(url, config) {
     if (config === void 0) config = {};
     return new AssetPromise(function(resolve, reject, setTaskCompleteProgress, setTaskDetailProgress) {
@@ -19400,7 +19659,7 @@ var MultiExecutor = /*#__PURE__*/ function() {
         var assetBaseURL = baseUrl;
         if (searchStr) {
             var params = searchStr.split("&");
-            for(var i = 0; i < params.length; i++){
+            for(var i = params.length - 1; i >= 0; i--){
                 var param = params[i];
                 if (param.startsWith("q=")) {
                     queryPath = decodeURIComponent(param.split("=")[1]);
@@ -19449,11 +19708,9 @@ var MultiExecutor = /*#__PURE__*/ function() {
                 Logger.warn("refId:" + refId + " is not find in this._editorResourceConfig.");
                 return Promise.resolve(null);
             }
-            var remoteUrl = resourceConfig.path;
-            var queryPath = new URL(remoteUrl).search;
-            var url = resourceConfig.virtualPath + queryPath;
+            var url = resourceConfig.virtualPath;
             if (key) {
-                url += (url.indexOf("?") > -1 ? "&" : "?") + "q=" + key;
+                url += "?q=" + key;
             }
             promise = this.load({
                 url: url,
@@ -20115,7 +20372,7 @@ exports.Collider = /*#__PURE__*/ function(Component) {
     function Collider(entity) {
         var _this;
         _this = Component.call(this, entity) || this, /** @internal */ _this._index = -1, _this._shapes = [];
-        _this._updateFlag = _this.entity.transform.registerWorldChangeFlag();
+        _this._updateFlag = entity.registerWorldChangeFlag();
         return _this;
     }
     var _proto = Collider.prototype;
@@ -20129,9 +20386,8 @@ exports.Collider = /*#__PURE__*/ function(Component) {
                 oldCollider.removeShape(shape);
             }
             this._shapes.push(shape);
-            shape._collider = this;
-            this._nativeCollider.addShape(shape._nativeShape);
-            this._phasedActiveInScene && this.scene.physics._addColliderShape(shape);
+            this._addNativeShape(shape);
+            this._handleShapesChanged();
         }
     };
     /**
@@ -20141,9 +20397,8 @@ exports.Collider = /*#__PURE__*/ function(Component) {
         var index = this._shapes.indexOf(shape);
         if (index !== -1) {
             this._shapes.splice(index, 1);
-            this._phasedActiveInScene && this.scene.physics._removeColliderShape(shape);
-            shape._collider = null;
-            this._nativeCollider.removeShape(shape._nativeShape);
+            this._removeNativeShape(shape);
+            this._handleShapesChanged();
         }
     };
     /**
@@ -20151,12 +20406,10 @@ exports.Collider = /*#__PURE__*/ function(Component) {
    */ _proto.clearShapes = function clearShapes() {
         var shapes = this._shapes;
         for(var i = 0, n = shapes.length; i < n; i++){
-            var shape = shapes[i];
-            this._phasedActiveInScene && this.scene.physics._removeColliderShape(shape);
-            shape._destroy();
-            this._nativeCollider.removeShape(shape._nativeShape);
+            this._removeNativeShape(shapes[i]);
         }
         shapes.length = 0;
+        this._handleShapesChanged();
     };
     /**
    * @internal
@@ -20177,42 +20430,46 @@ exports.Collider = /*#__PURE__*/ function(Component) {
     /**
    * @internal
    */ _proto._onEnableInScene = function _onEnableInScene() {
-        var physics = this.scene.physics;
-        physics._addCollider(this);
-        var shapes = this.shapes;
-        for(var i = 0, n = shapes.length; i < n; i++){
-            physics._addColliderShape(shapes[i]);
-        }
+        this.scene.physics._addCollider(this);
     };
     /**
    * @internal
    */ _proto._onDisableInScene = function _onDisableInScene() {
-        var physics = this.scene.physics;
-        physics._removeCollider(this);
-        var shapes = this.shapes;
-        for(var i = 0, n = shapes.length; i < n; i++){
-            physics._removeColliderShape(shapes[i]);
-        }
+        this.scene.physics._removeCollider(this);
     };
     /**
    * @internal
    */ _proto._cloneTo = function _cloneTo(target) {
-        var shapes = target._shapes;
-        for(var i = 0, n = shapes.length; i < n; i++){
-            target._addPhysicsShape(shapes[i]);
+        target._syncNative();
+    };
+    /**
+   * @internal
+   */ _proto._handleShapesChanged = function _handleShapesChanged() {};
+    _proto._syncNative = function _syncNative() {
+        for(var i = 0, n = this.shapes.length; i < n; i++){
+            this._addNativeShape(this.shapes[i]);
         }
     };
     /**
    * @internal
    */ _proto._onDestroy = function _onDestroy() {
         Component.prototype._onDestroy.call(this);
-        this.clearShapes();
+        var shapes = this._shapes;
+        for(var i = 0, n = shapes.length; i < n; i++){
+            var shape = shapes[i];
+            this._removeNativeShape(shape);
+            shape._destroy();
+        }
+        shapes.length = 0;
         this._nativeCollider.destroy();
     };
-    _proto._addPhysicsShape = function _addPhysicsShape(shape) {
+    _proto._addNativeShape = function _addNativeShape(shape) {
         shape._collider = this;
         this._nativeCollider.addShape(shape._nativeShape);
-        this._phasedActiveInScene && this.scene.physics._addColliderShape(shape);
+    };
+    _proto._removeNativeShape = function _removeNativeShape(shape) {
+        shape._collider = null;
+        this._nativeCollider.removeShape(shape._nativeShape);
     };
     _create_class(Collider, [
         {
@@ -20249,13 +20506,12 @@ var Collision = function Collision() {
  * A physics scene is a collection of colliders and constraints which can interact.
  */ var PhysicsScene = /*#__PURE__*/ function() {
     function PhysicsScene(scene) {
-        var _this = this;
         this._restTime = 0;
         this._fixedTimeStep = 1 / 60;
         this._colliders = new DisorderedArray();
         this._gravity = new engineMath.Vector3(0, -9.81, 0);
         this._onContactEnter = function(obj1, obj2) {
-            var physicalObjectsMap = _this._scene.engine._physicalObjectsMap;
+            var physicalObjectsMap = Engine._physicalObjectsMap;
             var shape1 = physicalObjectsMap[obj1];
             var shape2 = physicalObjectsMap[obj2];
             shape1.collider.entity._scripts.forEach(function(element) {
@@ -20274,7 +20530,7 @@ var Collision = function Collision() {
             });
         };
         this._onContactExit = function(obj1, obj2) {
-            var physicalObjectsMap = _this._scene.engine._physicalObjectsMap;
+            var physicalObjectsMap = Engine._physicalObjectsMap;
             var shape1 = physicalObjectsMap[obj1];
             var shape2 = physicalObjectsMap[obj2];
             shape1.collider.entity._scripts.forEach(function(element) {
@@ -20293,7 +20549,7 @@ var Collision = function Collision() {
             });
         };
         this._onContactStay = function(obj1, obj2) {
-            var physicalObjectsMap = _this._scene.engine._physicalObjectsMap;
+            var physicalObjectsMap = Engine._physicalObjectsMap;
             var shape1 = physicalObjectsMap[obj1];
             var shape2 = physicalObjectsMap[obj2];
             shape1.collider.entity._scripts.forEach(function(element) {
@@ -20312,7 +20568,7 @@ var Collision = function Collision() {
             });
         };
         this._onTriggerEnter = function(obj1, obj2) {
-            var physicalObjectsMap = _this._scene.engine._physicalObjectsMap;
+            var physicalObjectsMap = Engine._physicalObjectsMap;
             var shape1 = physicalObjectsMap[obj1];
             var shape2 = physicalObjectsMap[obj2];
             shape1.collider.entity._scripts.forEach(function(element) {
@@ -20327,7 +20583,7 @@ var Collision = function Collision() {
             });
         };
         this._onTriggerExit = function(obj1, obj2) {
-            var physicalObjectsMap = _this._scene.engine._physicalObjectsMap;
+            var physicalObjectsMap = Engine._physicalObjectsMap;
             var shape1 = physicalObjectsMap[obj1];
             var shape2 = physicalObjectsMap[obj2];
             shape1.collider.entity._scripts.forEach(function(element) {
@@ -20342,7 +20598,7 @@ var Collision = function Collision() {
             });
         };
         this._onTriggerStay = function(obj1, obj2) {
-            var physicalObjectsMap = _this._scene.engine._physicalObjectsMap;
+            var physicalObjectsMap = Engine._physicalObjectsMap;
             var shape1 = physicalObjectsMap[obj1];
             var shape2 = physicalObjectsMap[obj2];
             shape1.collider.entity._scripts.forEach(function(element) {
@@ -20367,7 +20623,6 @@ var Collision = function Collision() {
     }
     var _proto = PhysicsScene.prototype;
     _proto.raycast = function raycast(ray, distanceOrResult, layerMaskOrResult, outHitResult) {
-        var _this = this;
         var hitResult;
         var distance = Number.MAX_VALUE;
         if (typeof distanceOrResult === "number") {
@@ -20385,7 +20640,7 @@ var Collision = function Collision() {
             hitResult = outHitResult;
         }
         var onRaycast = function(obj) {
-            var shape = _this._scene.engine._physicalObjectsMap[obj];
+            var shape = Engine._physicalObjectsMap[obj];
             if (!shape) {
                 return false;
             }
@@ -20393,7 +20648,7 @@ var Collision = function Collision() {
         };
         if (hitResult != undefined) {
             var result = this._nativePhysicsScene.raycast(ray, distance, onRaycast, function(idx, distance, position, normal) {
-                var hitShape = _this._scene.engine._physicalObjectsMap[idx];
+                var hitShape = Engine._physicalObjectsMap[idx];
                 hitResult.entity = hitShape._collider.entity;
                 hitResult.shape = hitShape;
                 hitResult.distance = distance;
@@ -20431,22 +20686,6 @@ var Collision = function Collision() {
         }
     };
     /**
-   * Add ColliderShape into the manager.
-   * @param colliderShape - The Collider Shape.
-   * @internal
-   */ _proto._addColliderShape = function _addColliderShape(colliderShape) {
-        this._scene.engine._physicalObjectsMap[colliderShape.id] = colliderShape;
-        this._nativePhysicsScene.addColliderShape(colliderShape._nativeShape);
-    };
-    /**
-   * Remove ColliderShape.
-   * @param colliderShape - The Collider Shape.
-   * @internal
-   */ _proto._removeColliderShape = function _removeColliderShape(colliderShape) {
-        delete this._scene.engine._physicalObjectsMap[colliderShape.id];
-        this._nativePhysicsScene.removeColliderShape(colliderShape._nativeShape);
-    };
-    /**
    * Add collider into the manager.
    * @param collider - StaticCollider or DynamicCollider.
    * @internal
@@ -20589,13 +20828,6 @@ PhysicsScene._collision = new Collision();
         this._updateFlag.flag = true;
     };
     /**
-   * Remove all shape attached.
-   */ _proto.clearShapes = function clearShapes() {
-        if (this._shapes.length > 0) {
-            Collider.prototype.removeShape.call(this, this._shapes[0]);
-        }
-    };
-    /**
    * @internal
    */ _proto._onUpdate = function _onUpdate() {
         if (this._updateFlag.flag) {
@@ -20618,22 +20850,19 @@ PhysicsScene._collision = new Collision();
     /**
    * @internal
    */ _proto._onEnableInScene = function _onEnableInScene() {
-        var physics = this.scene.physics;
-        physics._addCharacterController(this);
-        var shapes = this.shapes;
-        for(var i = 0, n = shapes.length; i < n; i++){
-            physics._addColliderShape(shapes[i]);
-        }
+        this.scene.physics._addCharacterController(this);
     };
     /**
    * @internal
    */ _proto._onDisableInScene = function _onDisableInScene() {
-        var physics = this.scene.physics;
-        physics._removeCharacterController(this);
-        var shapes = this.shapes;
-        for(var i = 0, n = shapes.length; i < n; i++){
-            physics._removeColliderShape(shapes[i]);
-        }
+        this.scene.physics._removeCharacterController(this);
+    };
+    _proto._syncNative = function _syncNative() {
+        Collider.prototype._syncNative.call(this);
+        this._nativeCollider.setStepOffset(this._stepOffset);
+        this._nativeCollider.setNonWalkableMode(this._nonWalkableMode);
+        this._nativeCollider.setUpDirection(this._upDirection);
+        this._nativeCollider.setSlopeLimit(this._slopeLimit);
     };
     _proto._syncWorldPositionFromPhysicalSpace = function _syncWorldPositionFromPhysicalSpace() {
         this._nativeCollider.getWorldPosition(this.entity.transform.worldPosition);
@@ -20645,11 +20874,13 @@ PhysicsScene._collision = new Collision();
         {
             key: "stepOffset",
             get: /**
-   * The step offset for the controller.
+   * The step offset for the controller, the value must be greater than or equal to 0.
+   * @remarks Character can overcome obstacle less than the height(stepOffset + contractOffset of the shape).
    */ function get() {
                 return this._stepOffset;
             },
             set: function set(value) {
+                value = Math.max(0, value);
                 if (this._stepOffset !== value) {
                     this._stepOffset = value;
                     this._nativeCollider.setStepOffset(value);
@@ -20686,7 +20917,8 @@ PhysicsScene._collision = new Collision();
         {
             key: "slopeLimit",
             get: /**
-   * The slope limit for the controller.
+   * The slope limit for the controller, the value is the cosine value of the maximum slope angle.
+   * @defaultValue 0.707(the cosine value of 45 degrees)
    */ function get() {
                 return this._slopeLimit;
             },
@@ -20700,6 +20932,9 @@ PhysicsScene._collision = new Collision();
     ]);
     return CharacterController;
 }(exports.Collider);
+__decorate([
+    deepClone
+], CharacterController.prototype, "_upDirection", void 0);
 
 /**
  * A dynamic collider can act with self-defined movement or physical force.
@@ -20707,21 +20942,21 @@ PhysicsScene._collision = new Collision();
     _inherits(DynamicCollider, Collider);
     function DynamicCollider(entity) {
         var _this;
-        _this = Collider.call(this, entity) || this, _this._linearDamping = 0, _this._angularDamping = 0.05, _this._linearVelocity = new engineMath.Vector3(), _this._angularVelocity = new engineMath.Vector3(), _this._mass = 1.0, _this._centerOfMass = new engineMath.Vector3(), _this._inertiaTensor = new engineMath.Vector3(1, 1, 1), _this._maxAngularVelocity = 100, _this._maxDepenetrationVelocity = 1000, _this._solverIterations = 4, _this._isKinematic = false, _this._constraints = 0, _this._collisionDetectionMode = 0, _this._sleepThreshold = 5e-3;
+        _this = Collider.call(this, entity) || this, _this._linearDamping = 0, _this._angularDamping = 0.05, _this._linearVelocity = new engineMath.Vector3(), _this._angularVelocity = new engineMath.Vector3(), _this._mass = 1.0, _this._centerOfMass = new engineMath.Vector3(), _this._inertiaTensor = new engineMath.Vector3(1, 1, 1), _this._maxAngularVelocity = 100, _this._maxDepenetrationVelocity = 1.0000000331813535e32, _this._solverIterations = 4, _this._isKinematic = false, _this._constraints = 0, _this._collisionDetectionMode = 0, _this._sleepThreshold = 5e-3, _this._automaticCenterOfMass = true, _this._automaticInertiaTensor = true;
         var transform = _this.entity.transform;
         _this._nativeCollider = PhysicsScene._nativePhysics.createDynamicCollider(transform.worldPosition, transform.worldRotationQuaternion);
         _this._setLinearVelocity = _this._setLinearVelocity.bind(_this);
         _this._setAngularVelocity = _this._setAngularVelocity.bind(_this);
-        _this._setCenterOfMass = _this._setCenterOfMass.bind(_this);
-        _this._setInertiaTensor = _this._setInertiaTensor.bind(_this);
+        _this._handleCenterOfMassChanged = _this._handleCenterOfMassChanged.bind(_this);
+        _this._handleInertiaTensorChanged = _this._handleInertiaTensorChanged.bind(_this);
         //@ts-ignore
         _this._linearVelocity._onValueChanged = _this._setLinearVelocity;
         //@ts-ignore
         _this._angularVelocity._onValueChanged = _this._setAngularVelocity;
         //@ts-ignore
-        _this._centerOfMass._onValueChanged = _this._setCenterOfMass;
+        _this._centerOfMass._onValueChanged = _this._handleCenterOfMassChanged;
         //@ts-ignore
-        _this._inertiaTensor._onValueChanged = _this._setInertiaTensor;
+        _this._inertiaTensor._onValueChanged = _this._handleInertiaTensorChanged;
         return _this;
     }
     var _proto = DynamicCollider.prototype;
@@ -20729,16 +20964,16 @@ PhysicsScene._collision = new Collision();
    * Apply a force to the DynamicCollider.
    * @param force - The force make the collider move
    */ _proto.applyForce = function applyForce(force) {
-        this._nativeCollider.addForce(force);
+        this._phasedActiveInScene && this._nativeCollider.addForce(force);
     };
     /**
    * Apply a torque to the DynamicCollider.
    * @param torque - The force make the collider rotate
    */ _proto.applyTorque = function applyTorque(torque) {
-        this._nativeCollider.addTorque(torque);
+        this._phasedActiveInScene && this._nativeCollider.addTorque(torque);
     };
     _proto.move = function move(positionOrRotation, rotation) {
-        this._nativeCollider.move(positionOrRotation, rotation);
+        this._phasedActiveInScene && this._nativeCollider.move(positionOrRotation, rotation);
     };
     /**
    * Forces a collider to sleep at least one frame.
@@ -20746,6 +20981,12 @@ PhysicsScene._collision = new Collision();
         this._nativeCollider.sleep();
     };
     /**
+   * Returns whether the collider is sleeping.
+   * @returns True if the collider is sleeping, false otherwise.
+   */ _proto.isSleeping = function isSleeping() {
+        return this._nativeCollider.isSleeping();
+    };
+    /**
    * Forces a collider to wake up.
    */ _proto.wakeUp = function wakeUp() {
         this._nativeCollider.wakeUp();
@@ -20761,21 +21002,44 @@ PhysicsScene._collision = new Collision();
     /**
    * @internal
    */ _proto._cloneTo = function _cloneTo(target) {
+        target._linearVelocity.copyFrom(this.linearVelocity);
+        target._angularVelocity.copyFrom(this.angularVelocity);
+        target._centerOfMass.copyFrom(this.centerOfMass);
+        target._inertiaTensor.copyFrom(this.inertiaTensor);
         Collider.prototype._cloneTo.call(this, target);
-        target.linearDamping = this.linearDamping;
-        target.angularDamping = this.angularDamping;
-        target.linearVelocity = this.linearVelocity;
-        target.angularVelocity = this.angularVelocity;
-        target.mass = this.mass;
-        target.centerOfMass = this.centerOfMass;
-        target.inertiaTensor = this.inertiaTensor;
-        target.maxAngularVelocity = this.maxAngularVelocity;
-        target.maxDepenetrationVelocity = this.maxDepenetrationVelocity;
-        target.sleepThreshold = this.sleepThreshold;
-        target.solverIterations = this.solverIterations;
-        target.isKinematic = this.isKinematic;
-        target.constraints = this.constraints;
-        target.collisionDetectionMode = this.collisionDetectionMode;
+    };
+    /**
+   * @internal
+   */ _proto._handleShapesChanged = function _handleShapesChanged() {
+        if (this._automaticCenterOfMass || this._automaticInertiaTensor) {
+            this._setMassAndUpdateInertia();
+        }
+    };
+    _proto._syncNative = function _syncNative() {
+        Collider.prototype._syncNative.call(this);
+        this._nativeCollider.setLinearDamping(this._linearDamping);
+        this._nativeCollider.setAngularDamping(this._angularDamping);
+        this._nativeCollider.setLinearVelocity(this._linearVelocity);
+        this._nativeCollider.setAngularVelocity(this._angularVelocity);
+        if (this._automaticCenterOfMass || this._automaticInertiaTensor) {
+            this._setMassAndUpdateInertia();
+        } else {
+            this._nativeCollider.setMass(this._mass);
+            this._nativeCollider.setCenterOfMass(this._centerOfMass);
+            this._nativeCollider.setInertiaTensor(this._inertiaTensor);
+        }
+        this._nativeCollider.setMaxAngularVelocity(this._maxAngularVelocity);
+        this._nativeCollider.setMaxDepenetrationVelocity(this._maxDepenetrationVelocity);
+        this._nativeCollider.setSleepThreshold(this._sleepThreshold);
+        this._nativeCollider.setSolverIterations(this._solverIterations);
+        this._nativeCollider.setIsKinematic(this._isKinematic);
+        this._nativeCollider.setConstraints(this._constraints);
+        this._nativeCollider.setCollisionDetectionMode(this._collisionDetectionMode);
+    };
+    _proto._setMassAndUpdateInertia = function _setMassAndUpdateInertia() {
+        this._nativeCollider.setMassAndUpdateInertia(this._mass);
+        this._automaticCenterOfMass || this._nativeCollider.setCenterOfMass(this._centerOfMass);
+        this._automaticInertiaTensor || this._nativeCollider.setInertiaTensor(this._inertiaTensor);
     };
     _proto._setLinearVelocity = function _setLinearVelocity() {
         this._nativeCollider.setLinearVelocity(this._linearVelocity);
@@ -20783,11 +21047,19 @@ PhysicsScene._collision = new Collision();
     _proto._setAngularVelocity = function _setAngularVelocity() {
         this._nativeCollider.setAngularVelocity(this._angularVelocity);
     };
-    _proto._setCenterOfMass = function _setCenterOfMass() {
-        this._nativeCollider.setCenterOfMass(this._centerOfMass);
+    _proto._handleCenterOfMassChanged = function _handleCenterOfMassChanged() {
+        if (this._automaticCenterOfMass) {
+            console.warn("The center of mass is automatically calculated, please set automaticCenterOfMass to false if you want to set it manually.");
+        } else {
+            this._nativeCollider.setCenterOfMass(this._centerOfMass);
+        }
     };
-    _proto._setInertiaTensor = function _setInertiaTensor() {
-        this._nativeCollider.setInertiaTensor(this._inertiaTensor);
+    _proto._handleInertiaTensorChanged = function _handleInertiaTensorChanged() {
+        if (this._automaticInertiaTensor) {
+            console.warn("The inertia tensor is automatically calculated, please set automaticInertiaTensor to false if you want to set it manually.");
+        } else {
+            this._nativeCollider.setInertiaTensor(this._inertiaTensor);
+        }
     };
     _create_class(DynamicCollider, [
         {
@@ -20823,6 +21095,11 @@ PhysicsScene._collision = new Collision();
             get: /**
    * The linear velocity vector of the dynamic collider measured in world unit per second.
    */ function get() {
+                //@ts-ignore
+                this._linearVelocity._onValueChanged = null;
+                this._nativeCollider.getLinearVelocity(this._linearVelocity);
+                //@ts-ignore
+                this._linearVelocity._onValueChanged = this._setLinearVelocity;
                 return this._linearVelocity;
             },
             set: function set(value) {
@@ -20836,6 +21113,11 @@ PhysicsScene._collision = new Collision();
             get: /**
    * The angular velocity vector of the dynamic collider measured in radians per second.
    */ function get() {
+                //@ts-ignore
+                this._angularVelocity._onValueChanged = null;
+                this._nativeCollider.getAngularVelocity(this._angularVelocity);
+                //@ts-ignore
+                this._angularVelocity._onValueChanged = this._setAngularVelocity;
                 return this._angularVelocity;
             },
             set: function set(value) {
@@ -20854,7 +21136,28 @@ PhysicsScene._collision = new Collision();
             set: function set(value) {
                 if (this._mass !== value) {
                     this._mass = value;
-                    this._nativeCollider.setMass(value);
+                    if (this._automaticInertiaTensor || this._automaticCenterOfMass) {
+                        this._setMassAndUpdateInertia();
+                    } else {
+                        this._nativeCollider.setMass(value);
+                    }
+                }
+            }
+        },
+        {
+            key: "automaticCenterOfMass",
+            get: /**
+   * Whether or not to calculate the center of mass automatically, if true, the center of mass will be calculated based on the associated shapes.
+   * @remarks Affected by the position, rotation of the shapes.
+   */ function get() {
+                return this._automaticCenterOfMass;
+            },
+            set: function set(value) {
+                if (this._automaticCenterOfMass !== value) {
+                    this._automaticCenterOfMass = value;
+                    if (value) {
+                        this._setMassAndUpdateInertia();
+                    }
                 }
             }
         },
@@ -20862,7 +21165,13 @@ PhysicsScene._collision = new Collision();
             key: "centerOfMass",
             get: /**
    * The center of mass relative to the transform's origin.
+   * @remarks The center of mass is automatically calculated, if you want to set it manually, please set automaticCenterOfMass to false.
    */ function get() {
+                // @ts-ignore
+                this._centerOfMass._onValueChanged = null;
+                this._nativeCollider.getCenterOfMass(this._centerOfMass);
+                // @ts-ignore
+                this._centerOfMass._onValueChanged = this._handleCenterOfMassChanged;
                 return this._centerOfMass;
             },
             set: function set(value) {
@@ -20871,11 +21180,34 @@ PhysicsScene._collision = new Collision();
                 }
             }
         },
+        {
+            key: "automaticInertiaTensor",
+            get: /**
+   * Whether or not to calculate the inertia tensor automatically, if true, the inertia tensor will be calculated based on the associated shapes and mass.
+   * @remarks Affected by the position, rotation of the shapes and the mass of the collider.
+   */ function get() {
+                return this._automaticInertiaTensor;
+            },
+            set: function set(value) {
+                if (this._automaticInertiaTensor !== value) {
+                    this._automaticInertiaTensor = value;
+                    if (value) {
+                        this._setMassAndUpdateInertia();
+                    }
+                }
+            }
+        },
         {
             key: "inertiaTensor",
             get: /**
    * The diagonal inertia tensor of mass relative to the center of mass.
+   * @remarks The inertia tensor is automatically calculated, if you want to set it manually, please set automaticInertiaTensor to false.
    */ function get() {
+                // @ts-ignore
+                this._inertiaTensor._onValueChanged = null;
+                this._nativeCollider.getInertiaTensor(this._inertiaTensor);
+                // @ts-ignore
+                this._inertiaTensor._onValueChanged = this._handleInertiaTensorChanged;
                 return this._inertiaTensor;
             },
             set: function set(value) {
@@ -20985,21 +21317,12 @@ PhysicsScene._collision = new Collision();
     ]);
     return DynamicCollider;
 }(exports.Collider);
-__decorate([
-    ignoreClone
-], DynamicCollider.prototype, "_linearDamping", void 0);
-__decorate([
-    ignoreClone
-], DynamicCollider.prototype, "_angularDamping", void 0);
 __decorate([
     ignoreClone
 ], DynamicCollider.prototype, "_linearVelocity", void 0);
 __decorate([
     ignoreClone
 ], DynamicCollider.prototype, "_angularVelocity", void 0);
-__decorate([
-    ignoreClone
-], DynamicCollider.prototype, "_mass", void 0);
 __decorate([
     ignoreClone
 ], DynamicCollider.prototype, "_centerOfMass", void 0);
@@ -21008,25 +21331,16 @@ __decorate([
 ], DynamicCollider.prototype, "_inertiaTensor", void 0);
 __decorate([
     ignoreClone
-], DynamicCollider.prototype, "_maxAngularVelocity", void 0);
-__decorate([
-    ignoreClone
-], DynamicCollider.prototype, "_maxDepenetrationVelocity", void 0);
-__decorate([
-    ignoreClone
-], DynamicCollider.prototype, "_solverIterations", void 0);
-__decorate([
-    ignoreClone
-], DynamicCollider.prototype, "_isKinematic", void 0);
+], DynamicCollider.prototype, "_setLinearVelocity", null);
 __decorate([
     ignoreClone
-], DynamicCollider.prototype, "_constraints", void 0);
+], DynamicCollider.prototype, "_setAngularVelocity", null);
 __decorate([
     ignoreClone
-], DynamicCollider.prototype, "_collisionDetectionMode", void 0);
+], DynamicCollider.prototype, "_handleCenterOfMassChanged", null);
 __decorate([
     ignoreClone
-], DynamicCollider.prototype, "_sleepThreshold", void 0);
+], DynamicCollider.prototype, "_handleInertiaTensorChanged", null);
 /**
  * The collision detection mode constants.
  */ var CollisionDetectionMode = /*#__PURE__*/ function(CollisionDetectionMode) {
@@ -21073,9 +21387,9 @@ __decorate([
  * Material class to represent a set of surface properties.
  */ var PhysicsMaterial = /*#__PURE__*/ function() {
     function PhysicsMaterial() {
-        this._bounciness = 0.1;
-        this._dynamicFriction = 0.1;
-        this._staticFriction = 0.1;
+        this._bounciness = 0;
+        this._dynamicFriction = 0.6;
+        this._staticFriction = 0.6;
         this._bounceCombine = PhysicsMaterialCombineMode.Average;
         this._frictionCombine = PhysicsMaterialCombineMode.Average;
         this._nativeMaterial = PhysicsScene._nativePhysics.createPhysicsMaterial(this._staticFriction, this._dynamicFriction, this._bounciness, this._bounceCombine, this._frictionCombine);
@@ -21091,7 +21405,7 @@ __decorate([
         {
             key: "bounciness",
             get: /**
-   * The coefficient of bounciness.
+   * The coefficient of bounciness, ranging from 0 to 1.
    */ function get() {
                 return this._bounciness;
             },
@@ -21199,22 +21513,96 @@ exports.Joint = /*#__PURE__*/ function(Component) {
     _inherits(Joint, Component);
     function Joint(entity) {
         var _this;
-        _this = Component.call(this, entity) || this, _this._colliderInfo = new JointColliderInfo(), _this._connectedColliderInfo = new JointColliderInfo(), _this._force = 0, _this._torque = 0;
-        _this._connectedColliderInfo.localPosition = new engineMath.Vector3();
+        _this = Component.call(this, entity) || this, _this._colliderInfo = new JointColliderInfo(), _this._connectedColliderInfo = new JointColliderInfo(), _this._force = Infinity, _this._torque = Infinity, _this._automaticConnectedAnchor = true;
+        //@ts-ignore
+        _this._colliderInfo.anchor._onValueChanged = _this._updateActualAnchor.bind(_this, 1);
+        //@ts-ignore
+        _this._connectedColliderInfo.anchor._onValueChanged = _this._updateActualAnchor.bind(_this, 2);
+        _this._onSelfTransformChanged = _this._onSelfTransformChanged.bind(_this);
+        _this._onConnectedTransformChanged = _this._onConnectedTransformChanged.bind(_this);
+        // @ts-ignore
+        entity._updateFlagManager.addListener(_this._onSelfTransformChanged);
         return _this;
     }
     var _proto = Joint.prototype;
     /**
    * @internal
-   */ _proto._cloneTo = function _cloneTo(target) {
-        target.connectedCollider = this.connectedCollider;
-        target.connectedAnchor = this.connectedAnchor;
-        target.connectedMassScale = this.connectedMassScale;
-        target.connectedInertiaScale = this.connectedInertiaScale;
-        target.massScale = this.massScale;
-        target.inertiaScale = this.inertiaScale;
-        target.breakForce = this.breakForce;
-        target.breakTorque = this.breakTorque;
+   */ _proto._onEnableInScene = function _onEnableInScene() {
+        this._createJoint();
+        this._syncNative();
+    };
+    /**
+   * @internal
+   */ _proto._onDisableInScene = function _onDisableInScene() {
+        this._nativeJoint.destroy();
+        this._nativeJoint = null;
+    };
+    _proto._syncNative = function _syncNative() {
+        if (this._nativeJoint) {
+            var _this__connectedColliderInfo_collider;
+            this._nativeJoint.setConnectedCollider(((_this__connectedColliderInfo_collider = this._connectedColliderInfo.collider) == null ? void 0 : _this__connectedColliderInfo_collider._nativeCollider) || null);
+            this._updateActualAnchor(1);
+            if (this._automaticConnectedAnchor) {
+                this._calculateConnectedAnchor();
+            } else {
+                this._updateActualAnchor(2);
+            }
+            this._nativeJoint.setConnectedMassScale(this._connectedColliderInfo.massScale);
+            this._nativeJoint.setConnectedInertiaScale(this._connectedColliderInfo.inertiaScale);
+            this._nativeJoint.setMassScale(this._colliderInfo.massScale);
+            this._nativeJoint.setInertiaScale(this._colliderInfo.inertiaScale);
+            this._nativeJoint.setBreakForce(this._force);
+            this._nativeJoint.setBreakTorque(this._torque);
+        }
+    };
+    _proto._calculateConnectedAnchor = function _calculateConnectedAnchor() {
+        var colliderInfo = this._colliderInfo;
+        var connectedColliderInfo = this._connectedColliderInfo;
+        var _this_entity_transform = this.entity.transform, selfPos = _this_entity_transform.worldPosition;
+        var selfActualAnchor = colliderInfo.actualAnchor;
+        var connectedAnchor = connectedColliderInfo.anchor;
+        var connectedActualAnchor = connectedColliderInfo.actualAnchor;
+        var connectedCollider = connectedColliderInfo.collider;
+        if (connectedCollider) {
+            var _connectedCollider_entity_transform = connectedCollider.entity.transform, connectedPos = _connectedCollider_entity_transform.worldPosition, connectedWorldScale = _connectedCollider_entity_transform.lossyWorldScale;
+            engineMath.Vector3.subtract(selfPos, connectedPos, Joint._tempVector3);
+            engineMath.Vector3.add(Joint._tempVector3, selfActualAnchor, connectedActualAnchor);
+            engineMath.Vector3.divide(connectedActualAnchor, connectedWorldScale, connectedAnchor);
+        } else {
+            engineMath.Vector3.add(selfPos, selfActualAnchor, connectedActualAnchor);
+            connectedAnchor.copyFrom(connectedActualAnchor);
+        }
+    };
+    _proto._onSelfTransformChanged = function _onSelfTransformChanged(type) {
+        if (type & TransformModifyFlags.WorldScale) {
+            this._updateActualAnchor(1);
+        }
+    };
+    _proto._onConnectedTransformChanged = function _onConnectedTransformChanged(type) {
+        if (type & TransformModifyFlags.WorldScale) {
+            this._updateActualAnchor(2);
+        }
+    };
+    _proto._updateActualAnchor = function _updateActualAnchor(flag) {
+        if (flag & 1) {
+            var _this__nativeJoint;
+            var worldScale = this.entity.transform.lossyWorldScale;
+            var selfColliderInfo = this._colliderInfo;
+            engineMath.Vector3.multiply(selfColliderInfo.anchor, worldScale, selfColliderInfo.actualAnchor);
+            (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setAnchor(selfColliderInfo.actualAnchor);
+        }
+        if (flag & 2) {
+            var _this__nativeJoint1;
+            var connectedColliderInfo = this._connectedColliderInfo;
+            var connectedCollider = connectedColliderInfo.collider;
+            if (connectedCollider) {
+                var worldScale1 = connectedCollider.entity.transform.lossyWorldScale;
+                engineMath.Vector3.multiply(connectedColliderInfo.anchor, worldScale1, connectedColliderInfo.actualAnchor);
+            } else {
+                connectedColliderInfo.actualAnchor.copyFrom(connectedColliderInfo.anchor);
+            }
+            (_this__nativeJoint1 = this._nativeJoint) == null ? void 0 : _this__nativeJoint1.setConnectedAnchor(connectedColliderInfo.actualAnchor);
+        }
     };
     _create_class(Joint, [
         {
@@ -21226,8 +21614,33 @@ exports.Joint = /*#__PURE__*/ function(Component) {
             },
             set: function set(value) {
                 if (this._connectedColliderInfo.collider !== value) {
+                    var _this__connectedColliderInfo_collider, _this__nativeJoint;
+                    (_this__connectedColliderInfo_collider = this._connectedColliderInfo.collider) == null ? void 0 : _this__connectedColliderInfo_collider.entity._updateFlagManager.removeListener(this._onConnectedTransformChanged);
+                    value == null ? void 0 : value.entity._updateFlagManager.addListener(this._onConnectedTransformChanged);
                     this._connectedColliderInfo.collider = value;
-                    this._nativeJoint.setConnectedCollider(value._nativeCollider);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setConnectedCollider(value._nativeCollider);
+                    if (this._automaticConnectedAnchor) {
+                        this._calculateConnectedAnchor();
+                    } else {
+                        this._updateActualAnchor(2);
+                    }
+                }
+            }
+        },
+        {
+            key: "anchor",
+            get: /**
+   * The connected anchor position.
+   * @remarks If connectedCollider is set, this anchor is relative offset, or the anchor is world position.
+   */ function get() {
+                return this._colliderInfo.anchor;
+            },
+            set: function set(value) {
+                var anchor = this._colliderInfo.anchor;
+                if (value !== anchor) {
+                    anchor.copyFrom(value);
+                    this._updateActualAnchor(1);
+                    this._automaticConnectedAnchor && this._calculateConnectedAnchor();
                 }
             }
         },
@@ -21237,14 +21650,30 @@ exports.Joint = /*#__PURE__*/ function(Component) {
    * The connected anchor position.
    * @remarks If connectedCollider is set, this anchor is relative offset, or the anchor is world position.
    */ function get() {
-                return this._connectedColliderInfo.localPosition;
+                return this._connectedColliderInfo.anchor;
             },
             set: function set(value) {
-                var connectedAnchor = this._connectedColliderInfo.localPosition;
+                if (this.automaticConnectedAnchor) {
+                    console.warn("Cannot set connectedAnchor when automaticConnectedAnchor is true.");
+                    return;
+                }
+                var connectedAnchor = this._connectedColliderInfo.anchor;
                 if (value !== connectedAnchor) {
                     connectedAnchor.copyFrom(value);
+                    this._updateActualAnchor(2);
                 }
-                this._nativeJoint.setConnectedAnchor(value);
+            }
+        },
+        {
+            key: "automaticConnectedAnchor",
+            get: /**
+   * Whether or not to calculate the connectedAnchor automatically, if true, the connectedAnchor will be calculated automatically to match the global position of the anchor property.
+   */ function get() {
+                return this._automaticConnectedAnchor;
+            },
+            set: function set(value) {
+                this._automaticConnectedAnchor = value;
+                value && this._calculateConnectedAnchor();
             }
         },
         {
@@ -21256,36 +21685,39 @@ exports.Joint = /*#__PURE__*/ function(Component) {
             },
             set: function set(value) {
                 if (value !== this._connectedColliderInfo.massScale) {
+                    var _this__nativeJoint;
                     this._connectedColliderInfo.massScale = value;
-                    this._nativeJoint.setConnectedMassScale(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setConnectedMassScale(value);
                 }
             }
         },
         {
-            key: "connectedInertiaScale",
+            key: "massScale",
             get: /**
-   * The scale to apply to the inverse inertia of collider0 for resolving this constraint.
+   * The scale to apply to the inverse mass of collider 1 for resolving this constraint.
    */ function get() {
-                return this._connectedColliderInfo.inertiaScale;
+                return this._colliderInfo.massScale;
             },
             set: function set(value) {
-                if (value !== this._connectedColliderInfo.inertiaScale) {
-                    this._connectedColliderInfo.inertiaScale = value;
-                    this._nativeJoint.setConnectedInertiaScale(value);
+                if (value !== this._colliderInfo.massScale) {
+                    var _this__nativeJoint;
+                    this._colliderInfo.massScale = value;
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setMassScale(value);
                 }
             }
         },
         {
-            key: "massScale",
+            key: "connectedInertiaScale",
             get: /**
-   * The scale to apply to the inverse mass of collider 1 for resolving this constraint.
+   * The scale to apply to the inverse inertia of collider0 for resolving this constraint.
    */ function get() {
-                return this._colliderInfo.massScale;
+                return this._connectedColliderInfo.inertiaScale;
             },
             set: function set(value) {
-                if (value !== this._colliderInfo.massScale) {
-                    this._colliderInfo.massScale = value;
-                    this._nativeJoint.setMassScale(value);
+                if (value !== this._connectedColliderInfo.inertiaScale) {
+                    var _this__nativeJoint;
+                    this._connectedColliderInfo.inertiaScale = value;
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setConnectedInertiaScale(value);
                 }
             }
         },
@@ -21298,8 +21730,9 @@ exports.Joint = /*#__PURE__*/ function(Component) {
             },
             set: function set(value) {
                 if (value !== this._colliderInfo.inertiaScale) {
+                    var _this__nativeJoint;
                     this._colliderInfo.inertiaScale = value;
-                    this._nativeJoint.setInertiaScale(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setInertiaScale(value);
                 }
             }
         },
@@ -21312,8 +21745,9 @@ exports.Joint = /*#__PURE__*/ function(Component) {
             },
             set: function set(value) {
                 if (value !== this._force) {
+                    var _this__nativeJoint;
                     this._force = value;
-                    this._nativeJoint.setBreakForce(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setBreakForce(value);
                 }
             }
         },
@@ -21326,29 +21760,34 @@ exports.Joint = /*#__PURE__*/ function(Component) {
             },
             set: function set(value) {
                 if (value !== this._torque) {
+                    var _this__nativeJoint;
                     this._torque = value;
-                    this._nativeJoint.setBreakTorque(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setBreakTorque(value);
                 }
             }
         }
     ]);
     return Joint;
 }(Component);
+exports.Joint._tempVector3 = new engineMath.Vector3();
 __decorate([
-    ignoreClone
+    deepClone
 ], exports.Joint.prototype, "_colliderInfo", void 0);
 __decorate([
-    ignoreClone
+    deepClone
 ], exports.Joint.prototype, "_connectedColliderInfo", void 0);
 __decorate([
     ignoreClone
 ], exports.Joint.prototype, "_nativeJoint", void 0);
 __decorate([
     ignoreClone
-], exports.Joint.prototype, "_force", void 0);
+], exports.Joint.prototype, "_onSelfTransformChanged", null);
+__decorate([
+    ignoreClone
+], exports.Joint.prototype, "_onConnectedTransformChanged", null);
 __decorate([
     ignoreClone
-], exports.Joint.prototype, "_torque", void 0);
+], exports.Joint.prototype, "_updateActualAnchor", null);
 exports.Joint = __decorate([
     dependentComponents(exports.Collider, DependentMode.CheckOnly)
 ], exports.Joint);
@@ -21356,9 +21795,17 @@ exports.Joint = __decorate([
  * @internal
  */ var JointColliderInfo = function JointColliderInfo() {
     this.collider = null;
-    this.massScale = 0;
-    this.inertiaScale = 0;
+    this.anchor = new engineMath.Vector3();
+    this.actualAnchor = new engineMath.Vector3();
+    this.massScale = 1;
+    this.inertiaScale = 1;
 };
+__decorate([
+    deepClone
+], JointColliderInfo.prototype, "anchor", void 0);
+__decorate([
+    deepClone
+], JointColliderInfo.prototype, "actualAnchor", void 0);
 
 /*
  * A fixed joint permits no relative movement between two colliders. ie the colliders are glued together.
@@ -21368,12 +21815,10 @@ exports.Joint = __decorate([
         return Joint.apply(this, arguments) || this;
     }
     var _proto = FixedJoint.prototype;
-    /**
-   * @internal
-   */ _proto._onAwake = function _onAwake() {
-        var collider = this._colliderInfo;
-        collider.collider = this.entity.getComponent(exports.Collider);
-        this._nativeJoint = PhysicsScene._nativePhysics.createFixedJoint(collider.collider._nativeCollider);
+    _proto._createJoint = function _createJoint() {
+        var colliderInfo = this._colliderInfo;
+        colliderInfo.collider = this.entity.getComponent(exports.Collider);
+        this._nativeJoint = PhysicsScene._nativePhysics.createFixedJoint(colliderInfo.collider._nativeCollider);
     };
     return FixedJoint;
 }(exports.Joint);
@@ -21393,30 +21838,58 @@ exports.Joint = __decorate([
  * A joint which behaves in a similar way to a hinge or axle.
  */ var HingeJoint = /*#__PURE__*/ function(Joint) {
     _inherits(HingeJoint, Joint);
-    function HingeJoint() {
+    function HingeJoint(entity) {
         var _this;
-        _this = Joint.apply(this, arguments) || this, _this._axis = new engineMath.Vector3(1, 0, 0), _this._hingeFlags = HingeJointFlag.None, _this._useSpring = false;
+        _this = Joint.call(this, entity) || this, _this._axis = new engineMath.Vector3(1, 0, 0), _this._hingeFlags = HingeJointFlag.None, _this._useSpring = false, _this._angle = 0, _this._velocity = 0;
+        _this._onMotorChanged = _this._onMotorChanged.bind(_this);
+        _this._onLimitsChanged = _this._onLimitsChanged.bind(_this);
         return _this;
     }
     var _proto = HingeJoint.prototype;
     /**
    * @internal
-   */ _proto._onAwake = function _onAwake() {
-        var collider = this._colliderInfo;
-        collider.localPosition = new engineMath.Vector3();
-        collider.collider = this.entity.getComponent(exports.Collider);
-        this._nativeJoint = PhysicsScene._nativePhysics.createHingeJoint(collider.collider._nativeCollider);
-    };
-    /**
-   * @internal
-   */ _proto._cloneTo = function _cloneTo(target) {
-        target.axis = this.axis;
-        target.swingOffset = this.swingOffset;
-        target.useLimits = this.useLimits;
-        target.useMotor = this.useMotor;
-        target.useSpring = this.useSpring;
-        target.motor = this.motor;
-        target.limits = this.limits;
+   */ _proto._onDisableInScene = function _onDisableInScene() {
+        var nativeJoint = this._nativeJoint;
+        this._angle = nativeJoint.getAngle();
+        this._velocity = nativeJoint.getVelocity();
+        Joint.prototype._onDisableInScene.call(this);
+    };
+    _proto._createJoint = function _createJoint() {
+        var colliderInfo = this._colliderInfo;
+        colliderInfo.collider = this.entity.getComponent(exports.Collider);
+        this._nativeJoint = PhysicsScene._nativePhysics.createHingeJoint(colliderInfo.collider._nativeCollider);
+    };
+    _proto._syncNative = function _syncNative() {
+        Joint.prototype._syncNative.call(this);
+        var motor = this._jointMotor;
+        this._nativeJoint.setAxis(this._axis);
+        this._nativeJoint.setHingeJointFlag(HingeJointFlag.LimitEnabled, this.useLimits);
+        this._nativeJoint.setHingeJointFlag(HingeJointFlag.DriveEnabled, this.useMotor);
+        if (motor) {
+            this._nativeJoint.setDriveVelocity(motor.targetVelocity);
+            this._nativeJoint.setDriveForceLimit(motor.forceLimit);
+            this._nativeJoint.setDriveGearRatio(motor.gearRatio);
+            this._nativeJoint.setHingeJointFlag(HingeJointFlag.DriveFreeSpin, motor.freeSpin);
+        }
+    };
+    _proto._onMotorChanged = function _onMotorChanged() {
+        var motor = this._jointMotor;
+        if (this._nativeJoint) {
+            this._nativeJoint.setDriveVelocity(motor.targetVelocity);
+            this._nativeJoint.setDriveForceLimit(motor.forceLimit);
+            this._nativeJoint.setDriveGearRatio(motor.gearRatio);
+            this._nativeJoint.setHingeJointFlag(HingeJointFlag.DriveFreeSpin, motor.freeSpin);
+        }
+    };
+    _proto._onLimitsChanged = function _onLimitsChanged() {
+        var limits = this._limits;
+        if (limits && this._nativeJoint) {
+            if (this.useSpring) {
+                this._nativeJoint.setSoftLimit(limits.min, limits.max, limits.stiffness, limits.damping);
+            } else {
+                this._nativeJoint.setHardLimit(limits.min, limits.max, limits.contactDistance);
+            }
+        }
     };
     _create_class(HingeJoint, [
         {
@@ -21429,24 +21902,10 @@ exports.Joint = __decorate([
             set: function set(value) {
                 var axis = this._axis;
                 if (value !== axis) {
+                    var _this__nativeJoint;
                     axis.copyFrom(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setAxis(axis);
                 }
-                this._nativeJoint.setAxis(axis);
-            }
-        },
-        {
-            key: "swingOffset",
-            get: /**
-   * The swing offset.
-   */ function get() {
-                return this._colliderInfo.localPosition;
-            },
-            set: function set(value) {
-                var swingOffset = this._colliderInfo.localPosition;
-                if (value !== swingOffset) {
-                    swingOffset.copyFrom(value);
-                }
-                this._nativeJoint.setSwingOffset(swingOffset);
             }
         },
         {
@@ -21454,7 +21913,11 @@ exports.Joint = __decorate([
             get: /**
    * The current angle in degrees of the joint relative to its rest position.
    */ function get() {
-                return this._nativeJoint.getAngle();
+                var nativeJoint = this._nativeJoint;
+                if (nativeJoint) {
+                    this._angle = nativeJoint.getAngle();
+                }
+                return this._angle;
             }
         },
         {
@@ -21462,7 +21925,11 @@ exports.Joint = __decorate([
             get: /**
    * The angular velocity of the joint in degrees per second.
    */ function get() {
-                return this._nativeJoint.getVelocity();
+                var nativeJoint = this._nativeJoint;
+                if (nativeJoint) {
+                    this._velocity = nativeJoint.getVelocity();
+                }
+                return this._velocity;
             }
         },
         {
@@ -21474,8 +21941,9 @@ exports.Joint = __decorate([
             },
             set: function set(value) {
                 if (value !== this.useLimits) {
+                    var _this__nativeJoint;
                     value ? this._hingeFlags |= HingeJointFlag.LimitEnabled : this._hingeFlags &= ~HingeJointFlag.LimitEnabled;
-                    this._nativeJoint.setHingeJointFlag(HingeJointFlag.LimitEnabled, value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setHingeJointFlag(HingeJointFlag.LimitEnabled, value);
                 }
             }
         },
@@ -21488,8 +21956,9 @@ exports.Joint = __decorate([
             },
             set: function set(value) {
                 if (value !== this.useMotor) {
+                    var _this__nativeJoint;
                     value ? this._hingeFlags |= HingeJointFlag.DriveEnabled : this._hingeFlags &= ~HingeJointFlag.DriveEnabled;
-                    this._nativeJoint.setHingeJointFlag(HingeJointFlag.DriveEnabled, value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setHingeJointFlag(HingeJointFlag.DriveEnabled, value);
                 }
             }
         },
@@ -21503,7 +21972,7 @@ exports.Joint = __decorate([
             set: function set(value) {
                 if (this._useSpring !== value) {
                     this._useSpring = value;
-                    this.limits = this._limits;
+                    this._onLimitsChanged();
                 }
             }
         },
@@ -21512,15 +21981,15 @@ exports.Joint = __decorate([
             get: /**
    * The motor will apply a force up to a maximum force to achieve the target velocity in degrees per second.
    */ function get() {
-                return this._jointMonitor;
+                return this._jointMotor;
             },
             set: function set(value) {
-                if (this._jointMonitor !== value) {
-                    this._jointMonitor = value;
-                    this._nativeJoint.setDriveVelocity(value.targetVelocity);
-                    this._nativeJoint.setDriveForceLimit(value.forceLimit);
-                    this._nativeJoint.setDriveGearRatio(value.gearRation);
-                    this._nativeJoint.setHingeJointFlag(HingeJointFlag.DriveFreeSpin, value.freeSpin);
+                if (this._jointMotor !== value) {
+                    var _this__jointMotor;
+                    (_this__jointMotor = this._jointMotor) == null ? void 0 : _this__jointMotor._updateFlagManager.removeListener(this._onMotorChanged);
+                    this._jointMotor = value;
+                    value == null ? void 0 : value._updateFlagManager.addListener(this._onMotorChanged);
+                    this._onMotorChanged();
                 }
             }
         },
@@ -21533,12 +22002,11 @@ exports.Joint = __decorate([
             },
             set: function set(value) {
                 if (this._limits !== value) {
+                    var _this__limits;
+                    (_this__limits = this._limits) == null ? void 0 : _this__limits._updateFlagManager.removeListener(this._onLimitsChanged);
                     this._limits = value;
-                    if (this.useSpring) {
-                        this._nativeJoint.setSoftLimit(value.min, value.max, value.stiffness, value.damping);
-                    } else {
-                        this._nativeJoint.setHardLimit(value.min, value.max, value.contactDistance);
-                    }
+                    value == null ? void 0 : value._updateFlagManager.addListener(this._onLimitsChanged);
+                    this._onLimitsChanged();
                 }
             }
         }
@@ -21546,20 +22014,20 @@ exports.Joint = __decorate([
     return HingeJoint;
 }(exports.Joint);
 __decorate([
-    ignoreClone
+    deepClone
 ], HingeJoint.prototype, "_axis", void 0);
 __decorate([
-    ignoreClone
-], HingeJoint.prototype, "_hingeFlags", void 0);
+    deepClone
+], HingeJoint.prototype, "_jointMotor", void 0);
 __decorate([
-    ignoreClone
-], HingeJoint.prototype, "_useSpring", void 0);
+    deepClone
+], HingeJoint.prototype, "_limits", void 0);
 __decorate([
     ignoreClone
-], HingeJoint.prototype, "_jointMonitor", void 0);
+], HingeJoint.prototype, "_onMotorChanged", null);
 __decorate([
     ignoreClone
-], HingeJoint.prototype, "_limits", void 0);
+], HingeJoint.prototype, "_onLimitsChanged", null);
 
 /**
  * A joint that maintains an upper or lower bound (or both) on the distance between two points on different objects.
@@ -21571,40 +22039,20 @@ __decorate([
         return _this;
     }
     var _proto = SpringJoint.prototype;
-    /**
-   * @internal
-   */ _proto._onAwake = function _onAwake() {
-        var collider = this._colliderInfo;
-        collider.localPosition = new engineMath.Vector3();
-        collider.collider = this.entity.getComponent(exports.Collider);
-        this._nativeJoint = PhysicsScene._nativePhysics.createSpringJoint(collider.collider._nativeCollider);
-    };
-    /**
-   * @internal
-   */ _proto._cloneTo = function _cloneTo(target) {
-        target.swingOffset = this.swingOffset;
-        target.minDistance = this.minDistance;
-        target.maxDistance = this.maxDistance;
-        target.tolerance = this.tolerance;
-        target.stiffness = this.stiffness;
-        target.damping = this.damping;
+    _proto._createJoint = function _createJoint() {
+        var colliderInfo = this._colliderInfo;
+        colliderInfo.collider = this.entity.getComponent(exports.Collider);
+        this._nativeJoint = PhysicsScene._nativePhysics.createSpringJoint(colliderInfo.collider._nativeCollider);
+    };
+    _proto._syncNative = function _syncNative() {
+        Joint.prototype._syncNative.call(this);
+        this._nativeJoint.setMinDistance(this._minDistance);
+        this._nativeJoint.setMaxDistance(this._maxDistance);
+        this._nativeJoint.setTolerance(this._tolerance);
+        this._nativeJoint.setStiffness(this._stiffness);
+        this._nativeJoint.setDamping(this._damping);
     };
     _create_class(SpringJoint, [
-        {
-            key: "swingOffset",
-            get: /**
-   * The swing offset.
-   */ function get() {
-                return this._colliderInfo.localPosition;
-            },
-            set: function set(value) {
-                var swingOffset = this._colliderInfo.localPosition;
-                if (value !== swingOffset) {
-                    swingOffset.copyFrom(value);
-                }
-                this._nativeJoint.setSwingOffset(value);
-            }
-        },
         {
             key: "minDistance",
             get: /**
@@ -21614,8 +22062,9 @@ __decorate([
             },
             set: function set(value) {
                 if (this._minDistance !== value) {
+                    var _this__nativeJoint;
                     this._minDistance = value;
-                    this._nativeJoint.setMinDistance(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setMinDistance(value);
                 }
             }
         },
@@ -21628,8 +22077,9 @@ __decorate([
             },
             set: function set(value) {
                 if (this._maxDistance !== value) {
+                    var _this__nativeJoint;
                     this._maxDistance = value;
-                    this._nativeJoint.setMaxDistance(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setMaxDistance(value);
                 }
             }
         },
@@ -21642,8 +22092,9 @@ __decorate([
             },
             set: function set(value) {
                 if (this._tolerance !== value) {
+                    var _this__nativeJoint;
                     this._tolerance = value;
-                    this._nativeJoint.setTolerance(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setTolerance(value);
                 }
             }
         },
@@ -21656,8 +22107,9 @@ __decorate([
             },
             set: function set(value) {
                 if (this._stiffness !== value) {
+                    var _this__nativeJoint;
                     this._stiffness = value;
-                    this._nativeJoint.setStiffness(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setStiffness(value);
                 }
             }
         },
@@ -21670,8 +22122,9 @@ __decorate([
             },
             set: function set(value) {
                 if (this._damping !== value) {
+                    var _this__nativeJoint;
                     this._damping = value;
-                    this._nativeJoint.setDamping(value);
+                    (_this__nativeJoint = this._nativeJoint) == null ? void 0 : _this__nativeJoint.setDamping(value);
                 }
             }
         }
@@ -21681,22 +22134,168 @@ __decorate([
 
 /**
  * JointLimits is used to limit the joints angle.
- */ var JointLimits = function JointLimits() {
-    /** The upper angular limit (in degrees) of the joint. */ this.max = 0;
-    /** The lower angular limit (in degrees) of the joint. */ this.min = 0;
-    /** Distance inside the limit value at which the limit will be considered to be active by the solver. */ this.contactDistance = -1;
-    /** The spring forces used to reach the target position. */ this.stiffness = 0;
-    /** The damper force uses to dampen the spring. */ this.damping = 0;
-};
+ */ var JointLimits = /*#__PURE__*/ function() {
+    function JointLimits() {
+        this./** @internal */ _updateFlagManager = new UpdateFlagManager();
+        this._max = 0;
+        this._min = 0;
+        this._contactDistance = -1;
+        this._stiffness = 0;
+        this._damping = 0;
+    }
+    _create_class(JointLimits, [
+        {
+            key: "max",
+            get: /**
+   * The upper angular limit (in radians) of the joint.
+   */ function get() {
+                return this._max;
+            },
+            set: function set(value) {
+                if (value < this._min) {
+                    throw new Error("Max limit must be greater than min limit");
+                }
+                if (this._max !== value) {
+                    this._max = value;
+                    this._updateFlagManager.dispatch();
+                }
+            }
+        },
+        {
+            key: "min",
+            get: /**
+   * The lower angular limit (in radians) of the joint.
+   */ function get() {
+                return this._min;
+            },
+            set: function set(value) {
+                if (value > this._max) {
+                    throw new Error("Min limit must be less than max limit");
+                }
+                if (this._min !== value) {
+                    this._min = value;
+                    this._updateFlagManager.dispatch();
+                }
+            }
+        },
+        {
+            key: "contactDistance",
+            get: /**
+   * Distance inside the limit value at which the limit will be considered to be active by the solver.
+   * Default is the lesser of 0.1 radians, and 0.49 * (upperLimit - lowerLimit)
+   */ function get() {
+                if (this._contactDistance === -1) {
+                    return Math.min(0.1, 0.49 * (this._max - this._min));
+                }
+                return this._contactDistance;
+            },
+            set: function set(value) {
+                if (this._contactDistance !== value) {
+                    this._contactDistance = value;
+                    this._updateFlagManager.dispatch();
+                }
+            }
+        },
+        {
+            key: "stiffness",
+            get: /**
+   * The spring forces used to reach the target position.
+   */ function get() {
+                return this._stiffness;
+            },
+            set: function set(value) {
+                if (this._stiffness !== value) {
+                    this._stiffness = value;
+                    this._updateFlagManager.dispatch();
+                }
+            }
+        },
+        {
+            key: "damping",
+            get: /**
+   * The damper force uses to dampen the spring.
+   */ function get() {
+                return this._damping;
+            },
+            set: function set(value) {
+                if (this._damping !== value) {
+                    this._damping = value;
+                    this._updateFlagManager.dispatch();
+                }
+            }
+        }
+    ]);
+    return JointLimits;
+}();
+__decorate([
+    deepClone
+], JointLimits.prototype, "_updateFlagManager", void 0);
 
 /**
  * The JointMotor is used to motorize a joint.
- */ var JointMotor = function JointMotor() {
-    /** The motor will apply a force up to force to achieve targetVelocity. */ this.targetVelocity = 0;
-    /** The force limit.*/ this.forceLimit = Number.MAX_VALUE;
-    /** Gear ration for the motor */ this.gearRation = 1.0;
-    /** If freeSpin is enabled the motor will only accelerate but never slow down. */ this.freeSpin = false;
-};
+ */ var JointMotor = /*#__PURE__*/ function() {
+    function JointMotor() {
+        this./** @internal */ _updateFlagManager = new UpdateFlagManager();
+        this._targetVelocity = 0;
+        this._forceLimit = Number.MAX_VALUE;
+        this._gearRatio = 1.0;
+        this._freeSpin = false;
+    }
+    _create_class(JointMotor, [
+        {
+            key: "targetVelocity",
+            get: /**
+   * The motor will apply a force up to force to achieve targetVelocity.
+   */ function get() {
+                return this._targetVelocity;
+            },
+            set: function set(value) {
+                this._targetVelocity = value;
+                this._updateFlagManager.dispatch();
+            }
+        },
+        {
+            key: "forceLimit",
+            get: /**
+   * The force limit.
+   */ function get() {
+                return this._forceLimit;
+            },
+            set: function set(value) {
+                this._forceLimit = value;
+                this._updateFlagManager.dispatch();
+            }
+        },
+        {
+            key: "gearRatio",
+            get: /**
+   * Gear ration for the motor
+   */ function get() {
+                return this._gearRatio;
+            },
+            set: function set(value) {
+                this._gearRatio = value;
+                this._updateFlagManager.dispatch();
+            }
+        },
+        {
+            key: "freeSpin",
+            get: /**
+   * If freeSpin is enabled the motor will only accelerate but never slow down.
+   */ function get() {
+                return this._freeSpin;
+            },
+            set: function set(value) {
+                this._freeSpin = value;
+                this._updateFlagManager.dispatch();
+            }
+        }
+    ]);
+    return JointMotor;
+}();
+__decorate([
+    deepClone
+], JointMotor.prototype, "_updateFlagManager", void 0);
 
 /**
  * Abstract class for collider shapes.
@@ -21719,28 +22318,39 @@ __decorate([
         this._rotation._onValueChanged = this._setRotation;
         //@ts-ignore
         this._position._onValueChanged = this._setPosition;
+        Engine._physicalObjectsMap[this._id] = this;
     }
     var _proto = ColliderShape.prototype;
     /**
    * @internal
    */ _proto._cloneTo = function _cloneTo(target) {
-        target.contactOffset = this.contactOffset;
-        target.rotation = this.rotation;
-        target.position = this.position;
-        target.isTrigger = this.isTrigger;
-        target.material = this.material;
+        target._syncNative();
     };
     /**
    * @internal
    */ _proto._destroy = function _destroy() {
-        this._material._destroy();
         this._nativeShape.destroy();
+        this._nativeShape = null;
+        delete Engine._physicalObjectsMap[this._id];
+    };
+    _proto._syncNative = function _syncNative() {
+        var _this__collider;
+        this._nativeShape.setPosition(this._position);
+        this._nativeShape.setRotation(this._rotation);
+        this._nativeShape.setContactOffset(this._contactOffset);
+        this._nativeShape.setIsTrigger(this._isTrigger);
+        this._nativeShape.setMaterial(this._material._nativeMaterial);
+        (_this__collider = this._collider) == null ? void 0 : _this__collider._handleShapesChanged();
     };
     _proto._setPosition = function _setPosition() {
+        var _this__collider;
         this._nativeShape.setPosition(this._position);
+        (_this__collider = this._collider) == null ? void 0 : _this__collider._handleShapesChanged();
     };
     _proto._setRotation = function _setRotation() {
+        var _this__collider;
         this._nativeShape.setRotation(this._rotation);
+        (_this__collider = this._collider) == null ? void 0 : _this__collider._handleShapesChanged();
     };
     _create_class(ColliderShape, [
         {
@@ -21762,11 +22372,12 @@ __decorate([
         {
             key: "contactOffset",
             get: /**
-   * Contact offset for this shape.
+   * Contact offset for this shape, the value must be greater than or equal to 0.
    */ function get() {
                 return this._contactOffset;
             },
             set: function set(value) {
+                value = Math.max(0, value);
                 if (this._contactOffset !== value) {
                     this._contactOffset = value;
                     this._nativeShape.setContactOffset(value);
@@ -21841,20 +22452,17 @@ __decorate([
     ignoreClone
 ], ColliderShape.prototype, "_id", void 0);
 __decorate([
-    ignoreClone
-], ColliderShape.prototype, "_material", void 0);
-__decorate([
-    ignoreClone
-], ColliderShape.prototype, "_isTrigger", void 0);
-__decorate([
-    ignoreClone
+    deepClone
 ], ColliderShape.prototype, "_rotation", void 0);
 __decorate([
-    ignoreClone
+    deepClone
 ], ColliderShape.prototype, "_position", void 0);
 __decorate([
     ignoreClone
-], ColliderShape.prototype, "_contactOffset", void 0);
+], ColliderShape.prototype, "_setPosition", null);
+__decorate([
+    ignoreClone
+], ColliderShape.prototype, "_setRotation", null);
 
 /**
  * Physical collider shape for box.
@@ -21864,17 +22472,14 @@ __decorate([
         var _this;
         _this = ColliderShape.call(this) || this, _this._size = new engineMath.Vector3(1, 1, 1);
         _this._nativeShape = PhysicsScene._nativePhysics.createBoxColliderShape(_this._id, _this._size, _this._material._nativeMaterial);
-        _this._setSize = _this._setSize.bind(_this);
         //@ts-ignore
-        _this._size._onValueChanged = _this._setSize;
+        _this._size._onValueChanged = _this._setSize.bind(_this);
         return _this;
     }
     var _proto = BoxColliderShape.prototype;
-    /**
-   * @internal
-   */ _proto._cloneTo = function _cloneTo(target) {
-        ColliderShape.prototype._cloneTo.call(this, target);
-        target.size = this.size;
+    _proto._syncNative = function _syncNative() {
+        ColliderShape.prototype._syncNative.call(this);
+        this._setSize();
     };
     _proto._setSize = function _setSize() {
         this._nativeShape.setSize(this._size);
@@ -21897,8 +22502,11 @@ __decorate([
     return BoxColliderShape;
 }(ColliderShape);
 __decorate([
-    ignoreClone
+    deepClone
 ], BoxColliderShape.prototype, "_size", void 0);
+__decorate([
+    ignoreClone
+], BoxColliderShape.prototype, "_setSize", null);
 
 /**
  * Physical collider shape for sphere.
@@ -21911,9 +22519,9 @@ __decorate([
         return _this;
     }
     var _proto = SphereColliderShape.prototype;
-    _proto._cloneTo = function _cloneTo(target) {
-        ColliderShape.prototype._cloneTo.call(this, target);
-        target.radius = this.radius;
+    _proto._syncNative = function _syncNative() {
+        ColliderShape.prototype._syncNative.call(this);
+        this._nativeShape.setRadius(this._radius);
     };
     _create_class(SphereColliderShape, [
         {
@@ -21933,9 +22541,6 @@ __decorate([
     ]);
     return SphereColliderShape;
 }(ColliderShape);
-__decorate([
-    ignoreClone
-], SphereColliderShape.prototype, "_radius", void 0);
 
 /**
  * Physical collider shape plane.
@@ -21961,13 +22566,11 @@ __decorate([
         return _this;
     }
     var _proto = CapsuleColliderShape.prototype;
-    /**
-   * @internal
-   */ _proto._cloneTo = function _cloneTo(target) {
-        ColliderShape.prototype._cloneTo.call(this, target);
-        target.radius = this.radius;
-        target.height = this.height;
-        target.upAxis = this.upAxis;
+    _proto._syncNative = function _syncNative() {
+        ColliderShape.prototype._syncNative.call(this);
+        this._nativeShape.setRadius(this._radius);
+        this._nativeShape.setHeight(this._height);
+        this._nativeShape.setUpAxis(this._upAxis);
     };
     _create_class(CapsuleColliderShape, [
         {
@@ -22015,15 +22618,6 @@ __decorate([
     ]);
     return CapsuleColliderShape;
 }(ColliderShape);
-__decorate([
-    ignoreClone
-], CapsuleColliderShape.prototype, "_radius", void 0);
-__decorate([
-    ignoreClone
-], CapsuleColliderShape.prototype, "_height", void 0);
-__decorate([
-    ignoreClone
-], CapsuleColliderShape.prototype, "_upAxis", void 0);
 
 /**
  * Pointer Manager.
@@ -22589,7 +23183,7 @@ ParticleBufferUtils.boundsFloatStride = 8;
 ParticleBufferUtils.boundsTimeOffset = 6;
 ParticleBufferUtils.boundsMaxLifetimeOffset = 7;
 
-var blitFs = "#define GLSLIFY 1\nuniform mediump sampler2D renderer_BlitTexture;\n#ifdef HAS_TEX_LOD\nuniform float renderer_BlitMipLevel;\n#endif\nvarying vec2 v_uv;void main(){\n#ifdef HAS_TEX_LOD\ngl_FragColor=texture2DLodEXT(renderer_BlitTexture,v_uv,renderer_BlitMipLevel);\n#else\ngl_FragColor=texture2D(renderer_BlitTexture,v_uv);\n#endif\n}"; // eslint-disable-line
+var blitFs = "#define GLSLIFY 1\nuniform mediump sampler2D renderer_BlitTexture;\n#ifdef HAS_TEX_LOD\nuniform float renderer_BlitMipLevel;\n#endif\nvarying vec2 v_uv;void main(){vec2 uv=v_uv;\n#ifdef renderer_FlipYBlitTexture\nuv.y=1.0-uv.y;\n#endif\n#ifdef HAS_TEX_LOD\ngl_FragColor=texture2DLodEXT(renderer_BlitTexture,uv,renderer_BlitMipLevel);\n#else\ngl_FragColor=texture2D(renderer_BlitTexture,uv);\n#endif\n}"; // eslint-disable-line
 
 var blitVs = "#define GLSLIFY 1\nattribute vec4 POSITION_UV;varying vec2 v_uv;void main(){gl_Position=vec4(POSITION_UV.xy,0.0,1.0);v_uv=POSITION_UV.zw;}"; // eslint-disable-line
 
@@ -22863,7 +23457,7 @@ ShaderPool.init();
     _inherits(Engine, EventDispatcher);
     function Engine(canvas, hardwareRenderer, configuration) {
         var _this;
-        _this = EventDispatcher.call(this) || this, /** @internal */ _this._physicsInitialized = false, /** @internal */ _this._physicalObjectsMap = {}, /* @internal */ _this._lastRenderState = new RenderState(), /* @internal */ _this._renderElementPool = new ClearableObjectPool(RenderElement), /* @internal */ _this._subRenderElementPool = new ClearableObjectPool(SubRenderElement), /* @internal */ _this._textSubRenderElementPool = new ClearableObjectPool(SubRenderElement), /* @internal */ _this._charRenderInfoPool = new ReturnableObjectPool(CharRenderInfo, 50), /* @internal */ _this._renderContext = new RenderContext(), /* @internal */ _this._renderCount = 0, /* @internal */ _this._shaderProgramPools = [], /** @internal */ _this._fontMap = {}, /** @internal @todo: temporary solution */ _this._macroCollection = new ShaderMacroCollection(), _this._settings = {}, _this._resourceManager = new ResourceManager(_this), _this._sceneManager = new SceneManager(_this), _this._vSyncCount = 1, _this._targetFrameRate = 60, _this._time = new Time(), _this._isPaused = true, _this._vSyncCounter = 1, _this._targetFrameInterval = 1000 / 60, _this._destroyed = false, _this._frameInProcess = false, _this._waitingDestroy = false, _this._isDeviceLost = false, _this._waitingGC = false, _this._animate = function() {
+        _this = EventDispatcher.call(this) || this, /** @internal */ _this._physicsInitialized = false, /* @internal */ _this._lastRenderState = new RenderState(), /* @internal */ _this._renderElementPool = new ClearableObjectPool(RenderElement), /* @internal */ _this._subRenderElementPool = new ClearableObjectPool(SubRenderElement), /* @internal */ _this._textSubRenderElementPool = new ClearableObjectPool(SubRenderElement), /* @internal */ _this._charRenderInfoPool = new ReturnableObjectPool(CharRenderInfo, 50), /* @internal */ _this._renderContext = new RenderContext(), /* @internal */ _this._renderCount = 0, /* @internal */ _this._shaderProgramPools = [], /** @internal */ _this._fontMap = {}, /** @internal @todo: temporary solution */ _this._macroCollection = new ShaderMacroCollection(), _this._settings = {}, _this._resourceManager = new ResourceManager(_this), _this._sceneManager = new SceneManager(_this), _this._vSyncCount = 1, _this._targetFrameRate = 60, _this._time = new Time(), _this._isPaused = true, _this._vSyncCounter = 1, _this._targetFrameInterval = 1000 / 60, _this._destroyed = false, _this._frameInProcess = false, _this._waitingDestroy = false, _this._isDeviceLost = false, _this._waitingGC = false, _this._animate = function() {
             if (_this._vSyncCount) {
                 var _this_xrManager;
                 var raf = ((_this_xrManager = _this.xrManager) == null ? void 0 : _this_xrManager._getRequestAnimationFrame()) || requestAnimationFrame;
@@ -23288,6 +23882,7 @@ ShaderPool.init();
 /** @internal */ Engine._gammaMacro = ShaderMacro.getByName("ENGINE_IS_COLORSPACE_GAMMA");
 /** @internal */ Engine._noDepthTextureMacro = ShaderMacro.getByName("ENGINE_NO_DEPTH_TEXTURE");
 /** @internal Conversion of space units to pixel units for 2D. */ Engine._pixelsPerUnit = 100;
+/** @internal */ Engine._physicalObjectsMap = {};
 
 /**
  * Canvas.
@@ -29667,7 +30262,12 @@ var ParticleStopMode = /*#__PURE__*/ function(ParticleStopMode) {
     };
     _proto._render = function _render(context) {
         var generator = this.generator;
-        generator._primitive.instanceCount = generator._getAliveParticleCount();
+        // Don't need to render when no particles
+        var aliveParticleCount = generator._getAliveParticleCount();
+        if (!aliveParticleCount) {
+            return;
+        }
+        generator._primitive.instanceCount = aliveParticleCount;
         var material = this.getMaterial();
         if (!material) {
             return;
@@ -31815,7 +32415,8 @@ __decorate([
    */ _proto._emit = function _emit(time, count) {
         if (this.emission.enabled) {
             // Wait the existing particles to be retired
-            if (this.main._maxParticleBuffer < this._currentParticleCount) {
+            var notRetireParticleCount = this._getNotRetiredParticleCount();
+            if (notRetireParticleCount >= this.main.maxParticles) {
                 return;
             }
             var position = ParticleGenerator._tempVector30;
@@ -33592,6 +34193,401 @@ var cacheDir = new engineMath.Vector3();
     return CubeProbe;
 }(Probe);
 
+/**
+ * Audio Clip.
+ */ var AudioClip = /*#__PURE__*/ function(ReferResource) {
+    _inherits(AudioClip, ReferResource);
+    function AudioClip(engine, name) {
+        if (name === void 0) name = "";
+        var _this;
+        _this = ReferResource.call(this, engine) || this, _this._audioBuffer = null;
+        _this.name = name;
+        return _this;
+    }
+    var _proto = AudioClip.prototype;
+    /**
+   * @internal
+   */ _proto._getAudioSource = function _getAudioSource() {
+        return this._audioBuffer;
+    };
+    /**
+   * @internal
+   */ _proto._setAudioSource = function _setAudioSource(value) {
+        this._audioBuffer = value;
+    };
+    _proto._onDestroy = function _onDestroy() {
+        ReferResource.prototype._onDestroy.call(this);
+        this._audioBuffer = null;
+        this.name = null;
+    };
+    _create_class(AudioClip, [
+        {
+            key: "channels",
+            get: /**
+   * Number of discrete audio channels.
+   */ function get() {
+                return this._audioBuffer.numberOfChannels;
+            }
+        },
+        {
+            key: "sampleRate",
+            get: /**
+   * Sample rate, in samples per second.
+   */ function get() {
+                return this._audioBuffer.sampleRate;
+            }
+        },
+        {
+            key: "duration",
+            get: /**
+   * Duration, in seconds.
+   */ function get() {
+                return this._audioBuffer.duration;
+            }
+        }
+    ]);
+    return AudioClip;
+}(ReferResource);
+
+/**
+ * @internal
+ * Audio Manager.
+ */ var AudioManager = /*#__PURE__*/ function() {
+    function AudioManager() {}
+    AudioManager.getContext = function getContext() {
+        var context = AudioManager._context;
+        if (!context) {
+            AudioManager._context = context = new window.AudioContext();
+            // Safari can't resume audio context without element interaction
+            document.addEventListener("pointerdown", AudioManager._tryResume, true);
+            document.addEventListener("touchend", AudioManager._tryResume, true);
+            document.addEventListener("touchstart", AudioManager._tryResume, true);
+        }
+        return context;
+    };
+    AudioManager.getGainNode = function getGainNode() {
+        var gainNode = AudioManager._gainNode;
+        if (!AudioManager._gainNode) {
+            AudioManager._gainNode = gainNode = AudioManager.getContext().createGain();
+            gainNode.connect(AudioManager.getContext().destination);
+        }
+        return gainNode;
+    };
+    AudioManager.isAudioContextRunning = function isAudioContextRunning() {
+        if (AudioManager.getContext().state !== "running") {
+            console.warn("The AudioContext is not running and requires user interaction, such as a click or touch.");
+            return false;
+        }
+        return true;
+    };
+    AudioManager._tryResume = function _tryResume() {
+        if (AudioManager._context.state !== "running") {
+            if (AudioManager._isResuming) {
+                return;
+            }
+            AudioManager._isResuming = true;
+            AudioManager._context.resume().then(function() {
+                AudioManager._isResuming = false;
+            });
+        }
+    };
+    return AudioManager;
+}();
+AudioManager._isResuming = false;
+
+/**
+ * Audio Source Component.
+ */ var AudioSource = /*#__PURE__*/ function(Component) {
+    _inherits(AudioSource, Component);
+    function AudioSource(entity) {
+        var _this;
+        _this = Component.call(this, entity) || this, /** If set to true, the audio component automatically begins to play on startup. */ _this.playOnEnabled = true, _this._isPlaying = false, _this._sourceNode = null, _this._pausedTime = -1, _this._playTime = -1, _this._volume = 1, _this._lastVolume = 1, _this._playbackRate = 1, _this._loop = false;
+        _this._onPlayEnd = _this._onPlayEnd.bind(_this);
+        _this._gainNode = AudioManager.getContext().createGain();
+        _this._gainNode.connect(AudioManager.getGainNode());
+        return _this;
+    }
+    var _proto = AudioSource.prototype;
+    /**
+   * Play the clip.
+   */ _proto.play = function play() {
+        if (!this._canPlay()) {
+            return;
+        }
+        if (this._isPlaying) {
+            return;
+        }
+        var startTime = this._pausedTime > 0 ? this._pausedTime - this._playTime : 0;
+        this._initSourceNode(startTime);
+        this._playTime = AudioManager.getContext().currentTime - startTime;
+        this._pausedTime = -1;
+        this._isPlaying = true;
+    };
+    /**
+   * Stops playing the clip.
+   */ _proto.stop = function stop() {
+        if (this._isPlaying) {
+            this._clearSourceNode();
+            this._isPlaying = false;
+            this._pausedTime = -1;
+            this._playTime = -1;
+        }
+    };
+    /**
+   * Pauses playing the clip.
+   */ _proto.pause = function pause() {
+        if (this._isPlaying) {
+            this._clearSourceNode();
+            this._pausedTime = AudioManager.getContext().currentTime;
+            this._isPlaying = false;
+        }
+    };
+    /**
+   * @internal
+   */ _proto._onEnable = function _onEnable() {
+        this.playOnEnabled && this.play();
+    };
+    /**
+   * @internal
+   */ _proto._onDisable = function _onDisable() {
+        this.pause();
+    };
+    /**
+   * @internal
+   */ _proto._onDestroy = function _onDestroy() {
+        Component.prototype._onDestroy.call(this);
+        this.stop();
+        this.clip = null;
+    };
+    _proto._onPlayEnd = function _onPlayEnd() {
+        this.stop();
+    };
+    _proto._initSourceNode = function _initSourceNode(startTime) {
+        var context = AudioManager.getContext();
+        var sourceNode = context.createBufferSource();
+        sourceNode.buffer = this._clip._getAudioSource();
+        sourceNode.playbackRate.value = this._playbackRate;
+        sourceNode.loop = this._loop;
+        sourceNode.onended = this._onPlayEnd;
+        this._sourceNode = sourceNode;
+        sourceNode.connect(this._gainNode);
+        this._sourceNode.start(0, startTime);
+    };
+    _proto._clearSourceNode = function _clearSourceNode() {
+        this._sourceNode.stop();
+        this._sourceNode.disconnect();
+        this._sourceNode.onended = null;
+        this._sourceNode = null;
+    };
+    _proto._canPlay = function _canPlay() {
+        var _this__clip;
+        var isValidClip = ((_this__clip = this._clip) == null ? void 0 : _this__clip._getAudioSource()) ? true : false;
+        return isValidClip && AudioManager.isAudioContextRunning();
+    };
+    _create_class(AudioSource, [
+        {
+            key: "clip",
+            get: /**
+   * The audio clip to play.
+   */ function get() {
+                return this._clip;
+            },
+            set: function set(value) {
+                var lastClip = this._clip;
+                if (lastClip !== value) {
+                    lastClip && lastClip._addReferCount(-1);
+                    value && value._addReferCount(1);
+                    this._clip = value;
+                    this.stop();
+                }
+            }
+        },
+        {
+            key: "isPlaying",
+            get: /**
+   * Whether the clip playing right now.
+   */ function get() {
+                return this._isPlaying;
+            }
+        },
+        {
+            key: "volume",
+            get: /**
+   * The volume of the audio source, ranging from 0 to 1.
+   * @defaultValue `1`
+   */ function get() {
+                return this._volume;
+            },
+            set: function set(value) {
+                value = Math.min(Math.max(0, value), 1.0);
+                this._volume = value;
+                this._gainNode.gain.setValueAtTime(value, AudioManager.getContext().currentTime);
+            }
+        },
+        {
+            key: "playbackRate",
+            get: /**
+   * The playback rate of the audio source.
+   * @defaultValue `1`
+   */ function get() {
+                return this._playbackRate;
+            },
+            set: function set(value) {
+                this._playbackRate = value;
+                if (this._isPlaying) {
+                    this._sourceNode.playbackRate.value = this._playbackRate;
+                }
+            }
+        },
+        {
+            key: "mute",
+            get: /**
+   * Mutes or unmute the audio source.
+   * Mute sets volume as 0, unmute restore volume.
+   */ function get() {
+                return this.volume === 0;
+            },
+            set: function set(value) {
+                if (value) {
+                    this._lastVolume = this.volume;
+                    this.volume = 0;
+                } else {
+                    this.volume = this._lastVolume;
+                }
+            }
+        },
+        {
+            key: "loop",
+            get: /**
+   * Whether the audio clip looping.
+   * @defaultValue `false`
+   */ function get() {
+                return this._loop;
+            },
+            set: function set(value) {
+                if (value !== this._loop) {
+                    this._loop = value;
+                    if (this._isPlaying) {
+                        this._sourceNode.loop = this._loop;
+                    }
+                }
+            }
+        },
+        {
+            key: "time",
+            get: /**
+   * Playback position in seconds.
+   */ function get() {
+                if (this._isPlaying) {
+                    var currentTime = AudioManager.getContext().currentTime;
+                    return currentTime - this._playTime;
+                } else {
+                    return this._pausedTime > 0 ? this._pausedTime - this._playTime : 0;
+                }
+            }
+        }
+    ]);
+    return AudioSource;
+}(Component);
+__decorate([
+    ignoreClone
+], AudioSource.prototype, "_isPlaying", void 0);
+__decorate([
+    ignoreClone
+], AudioSource.prototype, "_clip", void 0);
+__decorate([
+    deepClone
+], AudioSource.prototype, "_gainNode", void 0);
+__decorate([
+    ignoreClone
+], AudioSource.prototype, "_sourceNode", void 0);
+__decorate([
+    deepClone
+], AudioSource.prototype, "_pausedTime", void 0);
+__decorate([
+    ignoreClone
+], AudioSource.prototype, "_playTime", void 0);
+__decorate([
+    deepClone
+], AudioSource.prototype, "_volume", void 0);
+__decorate([
+    deepClone
+], AudioSource.prototype, "_lastVolume", void 0);
+__decorate([
+    deepClone
+], AudioSource.prototype, "_playbackRate", void 0);
+__decorate([
+    deepClone
+], AudioSource.prototype, "_loop", void 0);
+
+/**
+ * @internal
+ */ var Polyfill = /*#__PURE__*/ function() {
+    function Polyfill() {}
+    Polyfill.registerPolyfill = function registerPolyfill() {
+        Polyfill._registerMatchAll();
+    };
+    Polyfill._registerMatchAll = function _registerMatchAll() {
+        if (!String.prototype.matchAll) {
+            Logger.info("polyfill String.prototype.matchAll");
+            String.prototype.matchAll = function(pattern) {
+                var flags = pattern.flags;
+                var globalFlagIdx = flags.indexOf("g");
+                if (globalFlagIdx === -1) {
+                    throw TypeError("String.prototype.matchAll called with a non-global RegExp argument");
+                }
+                var bindThis = this;
+                return function() {
+                    var matchResult, matchFlag, matchPattern, _tmp, _tmp1, _i, index, item;
+                    return __generator(this, function(_state) {
+                        switch(_state.label){
+                            case 0:
+                                matchResult = bindThis.match(pattern);
+                                if (matchResult == null) return [
+                                    2,
+                                    null
+                                ];
+                                matchFlag = flags.split("g").join("");
+                                matchPattern = new RegExp(pattern.source, matchFlag);
+                                _tmp = [];
+                                for(_tmp1 in matchResult)_tmp.push(_tmp1);
+                                _i = 0;
+                                _state.label = 1;
+                            case 1:
+                                if (!(_i < _tmp.length)) return [
+                                    3,
+                                    4
+                                ];
+                                index = _tmp[_i];
+                                item = matchResult[index];
+                                return [
+                                    4,
+                                    item.match(matchPattern)
+                                ];
+                            case 2:
+                                _state.sent();
+                                _state.label = 3;
+                            case 3:
+                                _i++;
+                                return [
+                                    3,
+                                    1
+                                ];
+                            case 4:
+                                return [
+                                    2
+                                ];
+                        }
+                    });
+                }();
+            };
+        }
+    };
+    return Polyfill;
+}();
+
+Polyfill.registerPolyfill();
+
 exports.AmbientLight = AmbientLight;
 exports.AnimationClip = AnimationClip;
 exports.AnimationClipCurveBinding = AnimationClipCurveBinding;
@@ -33611,6 +34607,9 @@ exports.AnimatorStateMachine = AnimatorStateMachine;
 exports.AnimatorStateTransition = AnimatorStateTransition;
 exports.AssetPromise = AssetPromise;
 exports.AssetType = AssetType;
+exports.AudioClip = AudioClip;
+exports.AudioManager = AudioManager;
+exports.AudioSource = AudioSource;
 exports.Background = Background;
 exports.BackgroundMode = BackgroundMode;
 exports.BackgroundTextureFillMode = BackgroundTextureFillMode;