@zephyr3d/scene 0.2.0 → 0.3.0

package/dist/scene/octree.js

@@ -1,5 +1,4 @@
-import { AABB, Vector3 } from '@zephyr3d/base';
-import { GraphNode } from './graph_node.js';
+import { AABB, Vector3, nextPowerOf2 } from '@zephyr3d/base';
 
 var OctreePlacement;
 (function(OctreePlacement) {
@@ -18,7 +17,6 @@ var OctreePlacement;
  */ class OctreeNode {
     /** @internal */ _chunk;
     /** @internal */ _position;
-    /** @internal */ _references;
     /** @internal */ _nodes;
     /** @internal */ _box;
     /** @internal */ _boxLoosed;
@@ -27,7 +25,6 @@ var OctreePlacement;
    */ constructor(){
         this._chunk = null;
         this._position = 0;
-        this._references = 0;
         this._nodes = [];
         this._box = null;
         this._boxLoosed = null;
@@ -50,6 +47,7 @@ var OctreePlacement;
    */ addNode(node) {
         if (node && this._nodes.indexOf(node) < 0) {
             this._nodes.push(node);
+            node.octreeNode = this;
         }
     }
     /**
@@ -59,9 +57,13 @@ var OctreePlacement;
         const index = this._nodes.indexOf(node);
         if (index >= 0) {
             this._nodes.splice(index, 1);
+            node.octreeNode = null;
         }
     }
     /** Removes all the scene nodes that this octree node contains */ clearNodes() {
+        for (const node of this._nodes){
+            node.octreeNode = null;
+        }
         this._nodes = [];
     }
     /**
@@ -90,12 +92,6 @@ var OctreePlacement;
         return this._position;
     }
     /**
-   * Invalidates the cached box
-   */ invalidateBox() {
-        this._box = null;
-        this.getParent()?.invalidateBox();
-    }
-    /**
    * Get the bounding box of the octree node
    * @returns The bounding box of the octree node
    */ getBox() {
@@ -112,15 +108,6 @@ var OctreePlacement;
                     }
                 }
             }
-            for (const node of this._nodes){
-                if (!node.isLight()) {
-                    const bv = node.getWorldBoundingVolume()?.toAABB();
-                    if (bv) {
-                        box.extend(bv.minPoint);
-                        box.extend(bv.maxPoint);
-                    }
-                }
-            }
             if (box.isValid()) {
                 this._box = box;
             }
@@ -186,12 +173,6 @@ var OctreePlacement;
         return this.getMaxPoint().addBy(new Vector3(halfNodeSize, halfNodeSize, halfNodeSize));
     }
     /**
-   * Get reference of the node
-   * @returns Reference of the node
-   */ getReference() {
-        return this._references;
-    }
-    /**
    * Gets the child node by a given placement
    * @param placement - The placement
    * @returns Child node at the given placement
@@ -238,23 +219,6 @@ var OctreePlacement;
         this.getOrCreateChild(OctreePlacement.NNN);
     }
     /**
-   * Free up all empty children
-   * @returns true if some children were freed
-   */ tidy() {
-        this._references = 8;
-        for(let i = 0; i < 8; i++){
-            const node = this.getChild(i);
-            if (!node || node.tidy()) {
-                --this._references;
-            }
-        }
-        if (this._nodes.length === 0 && this._references === 0) {
-            this._chunk.freeNodeByIndex(this._position);
-            return true;
-        }
-        return false;
-    }
-    /**
    * Traverse this node by a visitor
    * @param v - The visitor
    */ traverse(v) {
@@ -291,6 +255,9 @@ var OctreePlacement;
         this._prev = null;
         this._nodeMap = new Map();
     }
+    /** @internal */ get nodeMap() {
+        return this._nodeMap;
+    }
     /**
    * Gets an octree node at a given index
    * @param index - Index of the node
@@ -324,25 +291,6 @@ var OctreePlacement;
         return node;
     }
     /**
-   * Removes an octree node at given index
-   * @param index - Index of the node
-   */ freeNodeByIndex(index) {
-        const node = this._nodeMap.get(index);
-        if (node) {
-            node.clearNodes();
-            this._nodeMap.delete(index);
-        }
-    }
-    /**
-   * Removes an octree node
-   * @param node - The octree node to be removed
-   */ freeNode(node) {
-        if (node) {
-            console.assert(node.getChunk() === this, 'Invalid chunk');
-            this.freeNodeByIndex(node.getPosition());
-        }
-    }
-    /**
    * Removes all octree nodes of this chunk
    */ clearNodes() {
         for (const key of this._nodeMap.keys()){
@@ -516,10 +464,9 @@ var OctreePlacement;
    * @param rootSize - Root size of the octree
    * @param leafSize - Leaf size of the octree
    */ initialize(rootSize, leafSize) {
-        console.assert(rootSize >= leafSize && leafSize > 0, 'Invalid rootSize or leafSize for octree');
         this.finalize();
-        this._rootSize = rootSize;
         this._leafSize = leafSize;
+        this._rootSize = Math.max(leafSize, rootSize);
         let n = 1;
         for(; rootSize >= leafSize * 2; leafSize *= 2, ++n);
         for(let i = 0; i < n; ++i, rootSize *= 0.5){
@@ -535,6 +482,7 @@ var OctreePlacement;
         }
     }
     /** Free up the octree */ finalize() {
+        this._chunks.forEach((chunk)=>chunk.clearNodes());
         this._chunks = [];
         this._rootSize = 0;
         this._leafSize = 0;
@@ -576,10 +524,7 @@ var OctreePlacement;
         let py = Math.floor((center.y + this._rootSize * 0.5) * inv_node_size);
         let pz = Math.floor((center.z + this._rootSize * 0.5) * inv_node_size);
         if (px >= dim || py >= dim || pz >= dim) {
-            level = 0;
-            px = 0;
-            py = 0;
-            pz = 0;
+            return null;
         }
         const index = px + py * dim + pz * dim * dim;
         if (candidate && candidate.getChunk().getLevel() === level && candidate.getPosition() === index) {
@@ -615,21 +560,26 @@ var OctreePlacement;
    */ placeNode(node) {
         const curNode = this._nodeMap.get(node) || null;
         let locatedNode = this.getRootNode();
-        if (node.computedClipMode === GraphNode.CLIP_ENABLED) {
+        if (node.clipTestEnabled) {
             const bbox = node.getWorldBoundingVolume()?.toAABB();
             if (bbox && bbox.isValid()) {
                 const center = bbox.center;
                 const extents = bbox.extents;
                 const size = Math.max(Math.max(extents.x, extents.y), extents.z);
-                locatedNode = this.locateNodeChain(curNode, center, size) || this.getRootNode();
+                locatedNode = this.locateNodeChain(curNode, center, size);
+                if (!locatedNode) {
+                    const d = Math.max(...Vector3.abs(bbox.minPoint), ...Vector3.abs(bbox.maxPoint));
+                    // nodeSize >= 4 * size & octreeSize >= 2 * d
+                    this.resize(Math.max(d * 2, 4 * size));
+                    this.placeNode(node);
+                    return;
+                }
             }
         }
         if (curNode !== locatedNode) {
             curNode?.removeNode(node);
             locatedNode?.addNode(node);
             this._nodeMap.set(node, locatedNode);
-            curNode?.invalidateBox();
-            locatedNode?.invalidateBox();
         }
     }
     /**
@@ -640,11 +590,26 @@ var OctreePlacement;
             const curNode = this._nodeMap.get(node) || null;
             if (curNode) {
                 curNode.removeNode(node);
-                curNode.invalidateBox();
                 this._nodeMap.delete(node);
             }
         }
     }
+    resize(size) {
+        size = Math.max(nextPowerOf2(size), this._leafSize);
+        if (size === this._rootSize) {
+            return;
+        }
+        const nodes = [];
+        for (const chunk of this._chunks){
+            chunk.nodeMap.forEach((node)=>{
+                nodes.push(...node.getNodes());
+            });
+        }
+        this.initialize(size, this._leafSize);
+        for (const node of nodes){
+            this.placeNode(node);
+        }
+    }
 }
 
 export { Octree, OctreeNode, OctreeNodeChunk, OctreePlacement };

package/dist/scene/octree.js.map

@@ -1 +1 @@
-{"version":3,"file":"octree.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"octree.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/scene/octree_update_visitor.js

@@ -7,7 +7,11 @@ import { GraphNode } from './graph_node.js';
     }
     visit(node) {
         if (node instanceof GraphNode) {
-            this._octree.placeNode(node);
+            if (node.placeToOctree) {
+                this._octree.placeNode(node);
+            } else {
+                this._octree.removeNode(node);
+            }
         }
     }
 }

package/dist/scene/octree_update_visitor.js.map

@@ -1 +1 @@
-{"version":3,"file":"octree_update_visitor.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
+{"version":3,"file":"octree_update_visitor.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}

package/dist/scene/scene.js

@@ -45,7 +45,7 @@ import { Environment } from './environment.js';
    */ constructor(){
         super();
         this._id = ++Scene._nextId;
-        this._octree = new Octree(this, 2048, 64);
+        this._octree = new Octree(this, 8, 8);
         this._nodePlaceList = new Set();
         this._env = new Environment();
         this._updateEvent = new SceneUpdateEvent(this);
@@ -78,7 +78,7 @@ import { Environment } from './environment.js';
    */ get boundingBox() {
         this.updateNodePlacement(this._octree, this._nodePlaceList);
         // this._syncBVChangedList();
-        return this._octree.getRootNode().getBox() || this._octree.getRootNode().getBoxLoosed();
+        return this._octree.getRootNode().getBoxLoosed();
     }
     /**
    * The environment of the scene
@@ -130,13 +130,10 @@ import { Environment } from './environment.js';
         return new Ray(vEye, vDir);
     }
     /** @internal */ invalidateNodePlacement(node) {
-        if (node.isGraphNode() || node.children.length > 0) {
+        if (node.placeToOctree || node.octreeNode) {
             this._nodePlaceList.add(node);
         }
     }
-    /** @internal */ _xformChanged(node) {
-        this._nodePlaceList.add(node);
-    }
     /** @internal */ frameUpdate() {
         const frameInfo = Application.instance.device.frameInfo;
         if (frameInfo.frameCounter !== this._updateFrame) {
@@ -178,17 +175,10 @@ import { Environment } from './environment.js';
    * Update node placement in the octree
    */ updateNodePlacement(octree, list) {
         function placeNode(node, attached) {
-            if (node.isGraphNode()) {
-                if (attached && !node.hidden) {
-                    octree.placeNode(node);
-                } else {
-                    octree.removeNode(node);
-                }
-            }
-            for (const child of node.children){
-                if (child.isGraphNode()) {
-                    placeNode(child, attached);
-                }
+            if (attached && !node.hidden && node.placeToOctree) {
+                octree.placeNode(node);
+            } else {
+                octree.removeNode(node);
             }
             list.delete(node);
         }

package/dist/scene/scene.js.map

@@ -1 +1 @@
-{"version":3,"file":"scene.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"scene.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/scene/scene_node.js

@@ -12,16 +12,11 @@ import { XForm } from './xform.js';
  *
  * @public
  */ class SceneNode extends XForm {
-    static CLIP_INHERITED = -1;
-    static CLIP_DISABLED = 0;
-    static CLIP_ENABLED = 1;
-    static SHOW_INHERITED = -1;
-    static SHOW_HIDE = 0;
-    static SHOW_DEFAULT = 1;
-    static PICK_INHERITED = -1;
-    static PICK_DISABLED = 0;
-    static PICK_ENABLED = 1;
-    static BBOXDRAW_INHERITED = -1;
+    /*
+  static readonly PICK_INHERITED = -1;
+  static readonly PICK_DISABLED = 0;
+  static readonly PICK_ENABLED = 1;
+  */ static BBOXDRAW_INHERITED = -1;
     static BBOXDRAW_DISABLED = 0;
     static BBOXDRAW_LOCAL = 1;
     static BBOXDRAW_WORLD = 2;
@@ -35,6 +30,7 @@ import { XForm } from './xform.js';
     /** @internal */ _bv;
     /** @internal */ _bvDirty;
     /** @internal */ _bvWorld;
+    /** @internal */ _placeToOctree;
     /**
    * Creates a new scene node
    * @param scene - Which scene the node belongs to
@@ -45,14 +41,26 @@ import { XForm } from './xform.js';
         this._bv = null;
         this._bvWorld = null;
         this._bvDirty = true;
-        this._clipMode = SceneNode.CLIP_ENABLED;
+        this._clipMode = true;
         this._boxDrawMode = SceneNode.BBOXDRAW_DISABLED;
-        this._visible = SceneNode.SHOW_INHERITED;
-        this._pickMode = SceneNode.PICK_DISABLED;
+        this._visible = 'inherit';
+        this._pickMode = false;
+        this._placeToOctree = true;
         if (scene && this !== scene.rootNode) {
             this.reparent(scene.rootNode);
         }
     }
+    /** @internal */ get placeToOctree() {
+        return this._placeToOctree;
+    }
+    /** @internal */ set placeToOctree(val) {
+        if (!!val !== this._placeToOctree) {
+            this._placeToOctree = !!val;
+            if (this.isGraphNode()) {
+                this.scene.invalidateNodePlacement(this);
+            }
+        }
+    }
     /**
    * Name of the scene node
    */ get name() {
@@ -133,6 +141,9 @@ import { XForm } from './xform.js';
     /** true if this is a mesh node, false otherwise */ isMesh() {
         return false;
     }
+    /** true if this is a batch group, false otherwise */ isBatchGroup() {
+        return false;
+    }
     /** true if this is a terrain node, false otherwise */ isTerrain() {
         return false;
     }
@@ -185,36 +196,34 @@ import { XForm } from './xform.js';
    * Force the bounding volume to be recalculated
    */ invalidateBoundingVolume() {
         this._bvDirty = true;
-        this.invalidateWorldBoundingVolume();
+        this.invalidateWorldBoundingVolume(false);
     }
-    /** Force the world space bounding volume to be recalculated */ invalidateWorldBoundingVolume() {
+    /** Force the world space bounding volume to be recalculated */ invalidateWorldBoundingVolume(transformChanged) {
         this._bvWorld = null;
-        this._scene?.invalidateNodePlacement(this);
-    }
-    /**
-   * Computed value of clip mode
-   */ get computedClipMode() {
-        if (this._clipMode === SceneNode.CLIP_INHERITED) {
-            let parent = this.parent;
-            while(parent && !parent.isGraphNode()){
-                parent = parent.parent;
+        if (this._scene) {
+            if (transformChanged) {
+                this.iterate((node)=>{
+                    if (node.isGraphNode()) {
+                        this._scene.invalidateNodePlacement(node);
+                    }
+                });
+            } else if (this.isGraphNode()) {
+                this._scene.invalidateNodePlacement(this);
             }
-            return parent?.computedClipMode ?? SceneNode.CLIP_ENABLED;
         }
-        return this._clipMode;
     }
-    /** Clip mode */ get clipMode() {
+    /** Clip mode */ get clipTestEnabled() {
         return this._clipMode;
     }
-    set clipMode(val) {
+    set clipTestEnabled(val) {
         this._clipMode = val;
     }
     /** Computed value of show state */ get hidden() {
         let node = this;
-        while(node && node._visible === SceneNode.SHOW_INHERITED){
+        while(node && node._visible === 'inherit'){
             node = node.parent;
         }
-        return node ? node._visible === SceneNode.SHOW_HIDE : false;
+        return node ? node._visible === 'hidden' : false;
     }
     /** Show state */ get showState() {
         return this._visible;
@@ -229,17 +238,10 @@ import { XForm } from './xform.js';
         }
     }
     /** Computed value of pick mode */ get pickable() {
-        let node = this;
-        while(node && node._pickMode === SceneNode.PICK_INHERITED){
-            node = node.parent;
-        }
-        return node ? node._pickMode === SceneNode.PICK_ENABLED : false;
-    }
-    /** Pick mode */ get pickMode() {
         return this._pickMode;
     }
-    set pickMode(val) {
-        this._pickMode = val;
+    set pickable(val) {
+        this._pickMode = !!val;
     }
     /** Computed value for bounding box draw mode */ get computedBoundingBoxDrawMode() {
         if (this._boxDrawMode === SceneNode.BBOXDRAW_INHERITED) {
@@ -258,21 +260,32 @@ import { XForm } from './xform.js';
         this._boxDrawMode = mode;
     }
     /** @internal */ _setParent(p) {
-        if (p !== this._parent) {
+        let lastParent = this._parent;
+        let newParent = p;
+        if (newParent !== lastParent) {
             const sceneLast = this.attached ? this.scene : null;
-            const sceneNew = p?.attached ? p.scene : null;
+            const sceneNew = newParent?.attached ? newParent.scene : null;
             const willDetach = sceneLast && sceneLast !== sceneNew;
             const willAttach = sceneNew && sceneLast !== sceneNew;
             willDetach && this._willDetach();
             willAttach && this._willAttach();
-            super._setParent(p);
+            super._setParent(newParent);
             willDetach && this._detached();
             willAttach && this._attached();
         }
+        while(lastParent){
+            lastParent.dispatchEvent(this, 'noderemoved');
+            lastParent = lastParent.parent;
+        }
+        while(newParent){
+            newParent.dispatchEvent(this, 'nodeattached');
+            newParent = newParent.parent;
+        }
     }
     /** @internal */ _onTransformChanged(invalidateLocal) {
         super._onTransformChanged(invalidateLocal);
-        this.invalidateWorldBoundingVolume();
+        this.invalidateWorldBoundingVolume(true);
+        this.dispatchEvent(this, 'transformchanged');
     }
     /** @internal */ _willAttach() {}
     /** @internal */ _attached() {}
@@ -281,7 +294,7 @@ import { XForm } from './xform.js';
     /** @internal */ notifyHiddenChanged() {
         this._visibleChanged();
         for (const child of this._children){
-            if (child.showState === SceneNode.SHOW_INHERITED) {
+            if (child.showState === 'inherit') {
                 child.notifyHiddenChanged();
             }
         }

package/dist/scene/scene_node.js.map

@@ -1 +1 @@
-{"version":3,"file":"scene_node.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"scene_node.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/scene/xform.js

@@ -1,9 +1,9 @@
-import { ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 } from '@zephyr3d/base';
+import { makeEventTarget, ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 } from '@zephyr3d/base';
 
 /**
  * Presents a transformation from one space to another
  * @public
- */ class XForm {
+ */ class XForm extends makeEventTarget(Object)() {
     /** @internal */ _parent;
     /** @internal */ _children;
     /** @internal */ _position;
@@ -16,20 +16,20 @@ import { ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 }
     /** @internal */ _tmpLocalMatrix;
     /** @internal */ _tmpWorldMatrix;
     /** @internal */ _transformTag;
+    /** @internal */ _transformChangeCallback;
     /**
    * Creates an instance of XForm
    */ constructor(){
+        super();
         this._parent = null;
         this._children = [];
-        const cb = ()=>{
-            this._onTransformChanged(true);
-        };
+        this._transformChangeCallback = ()=>this._onTransformChanged(true);
         this._position = new ObservableVector3(0, 0, 0);
-        this._position.callback = cb;
+        this._position.callback = this._transformChangeCallback;
         this._scaling = new ObservableVector3(1, 1, 1);
-        this._scaling.callback = cb;
+        this._scaling.callback = this._transformChangeCallback;
         this._rotation = new ObservableQuaternion();
-        this._rotation.callback = cb;
+        this._rotation.callback = this._transformChangeCallback;
         this._worldMatrix = null;
         this._worldMatrixDet = null;
         this._invWorldMatrix = null;
@@ -51,22 +51,47 @@ import { ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 }
         return this._children;
     }
     /**
-   * Resets the transformation matrix
-   * @returns self
-   */ resetTransform() {
-        this._position.setXYZ(0, 0, 0);
-        this._rotation.identity();
-        this._scaling.setXYZ(1, 1, 1);
-        return this;
-    }
-    /**
    * Position of the xform relative to it's parent
    */ get position() {
+        if (!this._position) {
+            this.syncTRS();
+        }
         return this._position;
     }
     set position(val) {
+        if (!this._position) {
+            this.syncTRS();
+        }
         this._position.setXYZ(val[0], val[1], val[2]);
     }
+    /**
+   * Scaling of the xform
+   */ get scale() {
+        if (!this._scaling) {
+            this.syncTRS();
+        }
+        return this._scaling;
+    }
+    set scale(val) {
+        if (!this._scaling) {
+            this.syncTRS();
+        }
+        this._scaling.setXYZ(val[0], val[1], val[2]);
+    }
+    /**
+   * Rotation of the xform
+   */ get rotation() {
+        if (!this._rotation) {
+            this.syncTRS();
+        }
+        return this._rotation;
+    }
+    set rotation(val) {
+        if (!this._rotation) {
+            this.syncTRS();
+        }
+        this._rotation.setXYZW(val[0], val[1], val[2], val[3]);
+    }
     worldToThis(v, result) {
         if (v instanceof Vector3) {
             result = result || new Vector3();
@@ -118,27 +143,15 @@ import { ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 }
         return this;
     }
     /**
-   * Scaling of the xform
-   */ get scale() {
-        return this._scaling;
-    }
-    set scale(val) {
-        this._scaling.setXYZ(val[0], val[1], val[2]);
-    }
-    /**
-   * Rotation of the xform
-   */ get rotation() {
-        return this._rotation;
-    }
-    set rotation(val) {
-        this._rotation.setXYZW(val[0], val[1], val[2], val[3]);
-    }
-    /**
    * Sets the local transform matrix of the xform
-   * @param m - The transform matrix to set
+   * @param matrix - The transform matrix to set
    * @returns self
-   */ setLocalTransform(m) {
-        m.decompose(this._scaling, this._rotation, this._position);
+   */ setLocalTransform(matrix) {
+        this._localMatrix = matrix;
+        this._position = null;
+        this._rotation = null;
+        this._scaling = null;
+        this._onTransformChanged(false);
         return this;
     }
     /** Local transformation matrix of the xform */ get localMatrix() {
@@ -148,6 +161,9 @@ import { ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 }
         }
         return this._localMatrix;
     }
+    set localMatrix(matrix) {
+        this.setLocalTransform(matrix);
+    }
     /** World transformation matrix of the xform */ get worldMatrix() {
         if (!this._worldMatrix) {
             this._worldMatrix = this._tmpWorldMatrix;
@@ -192,6 +208,15 @@ import { ObservableVector3, ObservableQuaternion, Matrix4x4, Vector3, Vector4 }
     /** @internal */ getTag() {
         return this._transformTag;
     }
+    /** @internal */ syncTRS() {
+        this._position = new ObservableVector3();
+        this._rotation = new ObservableQuaternion();
+        this._scaling = new ObservableVector3();
+        this._localMatrix.decompose(this._scaling, this._rotation, this._position);
+        this._position.callback = this._transformChangeCallback;
+        this._rotation.callback = this._transformChangeCallback;
+        this._scaling.callback = this._transformChangeCallback;
+    }
     /** @internal */ _onTransformChanged(invalidateLocal) {
         if (invalidateLocal) {
             this._localMatrix = null;

package/dist/scene/xform.js.map

@@ -1 +1 @@
-{"version":3,"file":"xform.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"xform.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/shadow/esm.js

@@ -1,6 +1,7 @@
 import { ShadowImpl } from './shadow_impl.js';
 import '@zephyr3d/base';
 import { Application } from '../app.js';
+import '@zephyr3d/device';
 import { decodeNormalizedFloatFromRGBA, encodeNormalizedFloatToRGBA } from '../shaders/misc.js';
 import { GaussianBlurBlitter } from '../blitter/gaussianblur.js';
 import { computeShadowMapDepth, filterShadowESM } from '../shaders/shadow.js';

package/dist/shadow/esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}