@viamrobotics/motion-tools 1.26.1 → 1.27.0

package/dist/ecs/worldMatrix.d.ts

@@ -0,0 +1,10 @@
+import { type World } from 'koota';
+/**
+ * Wire up listeners that maintain `WorldMatrix` reactively. Subscribes to
+ * add/change/remove on `Matrix`, `EditedMatrix`, `LiveMatrix`, and `ChildOf`;
+ * enqueues affected entities and flushes on the next microtask.
+ *
+ * Returns an unsubscribe function. Plain function (not a rune hook) so tests
+ * can drive the lifecycle without mounting Svelte.
+ */
+export declare const installWorldMatrixListeners: (world: World) => (() => void);

package/dist/ecs/worldMatrix.js

@@ -0,0 +1,138 @@
+import {} from 'koota';
+import { Matrix4 } from 'three';
+import { composeLocalMatrix } from '../transform';
+import { ChildOf } from './relations';
+import { EditedMatrix, LiveMatrix, Matrix, WorldMatrix } from './traits';
+/**
+ * Compute the entity's local-to-parent transform into `out`. Mirrors the
+ * blend used by `Frame.svelte` so `WorldMatrix` agrees with the displayed
+ * scenegraph.
+ *
+ * - All three matrix traits present: `live × baseline⁻¹ × edited`.
+ * - Otherwise: prefer `EditedMatrix` over `Matrix`.
+ *
+ * Returns `true` after writing to `out`; returns `false` and leaves `out`
+ * untouched when the entity has no matrix-shaped trait.
+ */
+const toLocalMatrix = (entity, out) => {
+    const matrix = entity.get(Matrix);
+    const editedMatrix = entity.get(EditedMatrix);
+    const liveMatrix = entity.get(LiveMatrix);
+    if (liveMatrix && matrix && editedMatrix) {
+        composeLocalMatrix(liveMatrix, matrix, editedMatrix, out);
+        return true;
+    }
+    if (editedMatrix) {
+        out.copy(editedMatrix);
+        return true;
+    }
+    if (matrix) {
+        out.copy(matrix);
+        return true;
+    }
+    return false;
+};
+/**
+ * Synchronously compute and write `WorldMatrix` for every entity in `dirty`
+ * and every descendant via `ChildOf`. Memoizes per-entity world matrices in
+ * `cache` so siblings reuse a parent's result. Caller passes a fresh `cache`
+ * map per flush.
+ */
+const recomputeWorldMatrix = (world, entity, cache) => {
+    if (!entity.isAlive())
+        return undefined;
+    const cached = cache.get(entity);
+    if (cached)
+        return cached;
+    // Reuse the entity's existing `WorldMatrix` storage when present so a
+    // flush doesn't allocate a throwaway matrix per entity. First-time
+    // entities get a fresh `Matrix4` that's added as the trait below.
+    const out = entity.get(WorldMatrix) ?? new Matrix4();
+    const hasLocal = toLocalMatrix(entity, out);
+    if (!hasLocal)
+        out.identity();
+    const parent = entity.targetFor(ChildOf);
+    if (parent && parent.isAlive()) {
+        const parentWorld = recomputeWorldMatrix(world, parent, cache);
+        if (parentWorld)
+            out.premultiply(parentWorld);
+    }
+    cache.set(entity, out);
+    return out;
+};
+const flushDirty = (world, dirty) => {
+    if (dirty.size === 0)
+        return;
+    const cache = new Map();
+    const expanded = new Set();
+    const collect = (entity) => {
+        if (expanded.has(entity))
+            return;
+        expanded.add(entity);
+        for (const child of world.query(ChildOf(entity))) {
+            collect(child);
+        }
+    };
+    for (const entity of dirty)
+        collect(entity);
+    dirty.clear();
+    for (const entity of expanded) {
+        if (!entity.isAlive())
+            continue;
+        const worldMat = recomputeWorldMatrix(world, entity, cache);
+        if (!worldMat)
+            continue;
+        if (entity.has(WorldMatrix)) {
+            entity.changed(WorldMatrix);
+        }
+        else {
+            entity.add(WorldMatrix(worldMat));
+        }
+    }
+};
+/**
+ * Wire up listeners that maintain `WorldMatrix` reactively. Subscribes to
+ * add/change/remove on `Matrix`, `EditedMatrix`, `LiveMatrix`, and `ChildOf`;
+ * enqueues affected entities and flushes on the next microtask.
+ *
+ * Returns an unsubscribe function. Plain function (not a rune hook) so tests
+ * can drive the lifecycle without mounting Svelte.
+ */
+export const installWorldMatrixListeners = (world) => {
+    const dirty = new Set();
+    let scheduled = false;
+    const enqueue = (entity) => {
+        dirty.add(entity);
+        if (scheduled)
+            return;
+        scheduled = true;
+        queueMicrotask(() => {
+            scheduled = false;
+            flushDirty(world, dirty);
+        });
+    };
+    for (const entity of world.query(Matrix))
+        enqueue(entity);
+    for (const entity of world.query(EditedMatrix))
+        enqueue(entity);
+    for (const entity of world.query(LiveMatrix))
+        enqueue(entity);
+    const unsubs = [
+        world.onAdd(Matrix, enqueue),
+        world.onChange(Matrix, enqueue),
+        world.onRemove(Matrix, enqueue),
+        world.onAdd(EditedMatrix, enqueue),
+        world.onChange(EditedMatrix, enqueue),
+        world.onRemove(EditedMatrix, enqueue),
+        world.onAdd(LiveMatrix, enqueue),
+        world.onChange(LiveMatrix, enqueue),
+        world.onRemove(LiveMatrix, enqueue),
+        world.onAdd(ChildOf, enqueue),
+        world.onChange(ChildOf, enqueue),
+        world.onRemove(ChildOf, enqueue),
+    ];
+    return () => {
+        for (const unsub of unsubs)
+            unsub();
+    };
+};

package/dist/editing/FrameEditSession.js

@@ -1,5 +1,6 @@
 import { hierarchy, traits } from '../ecs';
-import { isFinitePose } from '../transform';
+import { createPose, isFinitePose, matrixToPose, poseToMatrix } from '../transform';
+const tempPose = createPose();
 const captureGeometry = (entity) => {
     const box = entity.get(traits.Box);
     if (box)
@@ -71,13 +72,14 @@ export class FrameEditSession {
         this.onClose = onClose;
         for (const entity of entities) {
             const name = entity.get(traits.Name);
-            const editedPose = entity.get(traits.EditedPose);
-            if (!name || !editedPose)
+            const editedMatrix = entity.get(traits.EditedMatrix);
+            if (!name || !editedMatrix)
                 continue;
+            matrixToPose(editedMatrix, tempPose);
             this.snapshots.set(entity, {
                 name,
                 parent: hierarchy.getParentName(entity) ?? 'world',
-                editedPose: { ...editedPose },
+                editedPose: { ...tempPose },
                 geometry: captureGeometry(entity),
             });
         }
@@ -92,11 +94,13 @@ export class FrameEditSession {
         const snap = this.snapshots.get(entity);
         if (!snap || this.#closed)
             return;
-        const current = entity.get(traits.EditedPose);
+        const current = entity.get(traits.EditedMatrix);
         if (!current)
             return;
-        const next = { ...current, ...pose };
-        entity.set(traits.EditedPose, next);
+        matrixToPose(current, tempPose);
+        const next = { ...tempPose, ...pose };
+        poseToMatrix(next, current);
+        entity.changed(traits.EditedMatrix);
         this.updateFrame(snap.name, hierarchy.getParentName(entity) ?? 'world', next, liveGeometry(entity));
     };
     stageGeometry = (entity, geometry) => {
@@ -116,9 +120,10 @@ export class FrameEditSession {
         else if (geometry.type === 'capsule') {
             restoreGeometryTrait(entity, { type: 'capsule', capsule: { r: geometry.r, l: geometry.l } });
         }
-        const editedPose = entity.get(traits.EditedPose);
-        if (editedPose) {
-            this.updateFrame(snap.name, hierarchy.getParentName(entity) ?? 'world', editedPose, geometry);
+        const editedMatrix = entity.get(traits.EditedMatrix);
+        if (editedMatrix) {
+            matrixToPose(editedMatrix, tempPose);
+            this.updateFrame(snap.name, hierarchy.getParentName(entity) ?? 'world', { ...tempPose }, geometry);
         }
     };
     stageParent = (entity, parent) => {
@@ -126,9 +131,10 @@ export class FrameEditSession {
         if (!snap || this.#closed)
             return;
         hierarchy.setParent(entity, parent === 'world' ? undefined : parent);
-        const editedPose = entity.get(traits.EditedPose);
-        if (editedPose) {
-            this.updateFrame(snap.name, parent, editedPose, liveGeometry(entity));
+        const editedMatrix = entity.get(traits.EditedMatrix);
+        if (editedMatrix) {
+            matrixToPose(editedMatrix, tempPose);
+            this.updateFrame(snap.name, parent, { ...tempPose }, liveGeometry(entity));
         }
     };
     stageDelete = (entity) => {
@@ -145,10 +151,13 @@ export class FrameEditSession {
         if (this.#closed)
             return false;
         for (const [entity] of this.snapshots) {
-            const pose = entity.get(traits.EditedPose);
-            if (pose && !isFinitePose(pose)) {
-                this.abort();
-                return false;
+            const matrix = entity.get(traits.EditedMatrix);
+            if (matrix) {
+                matrixToPose(matrix, tempPose);
+                if (!isFinitePose(tempPose)) {
+                    this.abort();
+                    return false;
+                }
             }
         }
         this.#close();
@@ -163,7 +172,11 @@ export class FrameEditSession {
             return;
         for (const [entity, snap] of this.snapshots) {
             if (entity.isAlive()) {
-                entity.set(traits.EditedPose, snap.editedPose);
+                const matrix = entity.get(traits.EditedMatrix);
+                if (matrix) {
+                    poseToMatrix(snap.editedPose, matrix);
+                    entity.changed(traits.EditedMatrix);
+                }
                 hierarchy.setParent(entity, snap.parent === 'world' ? undefined : snap.parent);
                 restoreGeometryTrait(entity, snap.geometry);
             }

package/dist/hooks/use3DModels.svelte.js

@@ -48,13 +48,13 @@ export const provide3DModels = (partID) => {
                         }
                     });
                 }
-                current = next;
             }
             catch (error) {
                 // some arms may not implement this api yet
                 console.warn(`${client.current.name} returned an error: ${error} when getting 3D models`);
             }
         }
+        current = next;
     };
     $effect(() => {
         const shouldFetchModels = settings.isLoaded && settings.current.renderArmModels.includes('model');

package/dist/hooks/useConfigFrames.svelte.js

@@ -57,6 +57,18 @@ export const provideConfigFrames = () => {
     const frameValues = $derived(Object.values(frames));
     const getParentFrameOptions = (componentName) => {
         const validFrames = new Set(frameValues.map((frame) => frame.referenceFrame));
+        /**
+         * Fragment components without a mod don't appear in frameValues (we only
+         * track frames with explicit $set mods), but the fragment itself supplies
+         * their frame so they render in the scene and are valid parents. Exclude
+         * any whose frame the user has $unset.
+         */
+        const unsetFragmentNames = new Set(fragmentUnsetFrameNames);
+        for (const name of Object.keys(partConfig.componentNameToFragmentId)) {
+            if (!unsetFragmentNames.has(name)) {
+                validFrames.add(name);
+            }
+        }
         validFrames.add('world');
         const frameNameQueue = [componentName];
         while (frameNameQueue.length > 0) {

package/dist/hooks/useDrawAPI.svelte.js

@@ -1,7 +1,7 @@
 import { useThrelte } from '@threlte/core';
 import {} from 'koota';
 import { getContext, setContext } from 'svelte';
-import { Color, Vector3, Vector4 } from 'three';
+import { Color, Matrix4, Vector3, Vector4 } from 'three';
 import { NURBSCurve } from 'three/addons/curves/NURBSCurve.js';
 import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
 import { UuidTool } from 'uuid-tool';
@@ -11,7 +11,7 @@ import { asRGB, STRIDE } from '../buffer';
 import { hierarchy, traits, useWorld } from '../ecs';
 import { createBox, createCapsule, createSphere } from '../geometry';
 import { parsePlyInput } from '../ply';
-import { createPose, createPoseFromFrame } from '../transform';
+import { createPose, createPoseFromFrame, poseToMatrix } from '../transform';
 import { useCameraControls } from './useControls.svelte';
 import { useDrawConnectionConfig } from './useDrawConnectionConfig.svelte';
 import { useLogs } from './useLogs.svelte';
@@ -126,7 +126,11 @@ export const provideDrawAPI = () => {
             const parent = frame.parent;
             const existing = entities.get(name);
             if (existing) {
-                existing.set(traits.Pose, pose);
+                const matrix = existing.get(traits.Matrix);
+                if (matrix) {
+                    poseToMatrix(pose, matrix);
+                    existing.changed(traits.Matrix);
+                }
                 hierarchy.setParent(existing, parent);
                 continue;
             }
@@ -146,7 +150,7 @@ export const provideDrawAPI = () => {
             if (frame.geometry) {
                 entityTraits.push(geometryTrait());
             }
-            entityTraits.push(traits.Name(name), traits.Pose(pose), traits.DrawAPI, traits.ReferenceFrame, traits.Removable, traits.ShowAxesHelper);
+            entityTraits.push(traits.Name(name), traits.Matrix(poseToMatrix(pose, new Matrix4())), traits.DrawAPI, traits.ReferenceFrame, traits.Removable, traits.ShowAxesHelper);
             const entity = world.spawn(...entityTraits);
             entities.set(name, entity);
         }
@@ -157,7 +161,11 @@ export const provideDrawAPI = () => {
         const pose = createPose(data.center);
         const existing = entities.get(name);
         if (existing) {
-            existing.set(traits.Pose, pose);
+            const matrix = existing.get(traits.Matrix);
+            if (matrix) {
+                poseToMatrix(pose, matrix);
+                existing.changed(traits.Matrix);
+            }
             return;
         }
         const geometryTrait = () => {
@@ -179,7 +187,7 @@ export const provideDrawAPI = () => {
         const entityTraits = [
             traits.Name(data.label ?? ++geometryIndex),
             ...hierarchy.parentTraits(parent),
-            traits.Pose(pose),
+            traits.Matrix(poseToMatrix(pose, new Matrix4())),
             traits.Color(colorUtil.set(color)),
             geometryTrait(),
             traits.DrawAPI,

package/dist/hooks/useDrawService.svelte.js

@@ -10,7 +10,7 @@ import { DrawService } from '../buf/draw/v1/service_connect';
 import { CreateRelationshipRequest, DeleteRelationshipRequest, EntityChangeType, StreamEntityChangesResponse, } from '../buf/draw/v1/service_pb';
 import { asFloat32Array, inMeters, STRIDE } from '../buffer';
 import { drawDrawing, drawTransform, updateDrawing, updateModel, updateTransform, uuidStringToBytes, } from '../draw';
-import { traits, useWorld } from '../ecs';
+import { hierarchy, traits, useWorld } from '../ecs';
 import { useCameraControls } from './useControls.svelte';
 import { useDrawConnectionConfig } from './useDrawConnectionConfig.svelte';
 import { useRelationships } from './useRelationships.svelte';
@@ -50,8 +50,7 @@ export function provideDrawService() {
         const entity = drawingEntities.get(uuidStr);
         if (!entity)
             return;
-        if (world.has(entity))
-            entity.destroy();
+        hierarchy.destroyEntityTree(world, entity);
         drawingEntities.delete(uuidStr);
     };
     const processEvent = (event) => {
@@ -334,13 +333,11 @@ export function provideDrawService() {
             connectionStatus = ConnectionStatus.DISCONNECTED;
             activeClient = undefined;
             for (const entity of transformEntities.values()) {
-                if (world.has(entity))
-                    entity.destroy();
+                hierarchy.destroyEntityTree(world, entity);
             }
             transformEntities.clear();
             for (const entity of drawingEntities.values()) {
-                if (world.has(entity))
-                    entity.destroy();
+                hierarchy.destroyEntityTree(world, entity);
             }
             drawingEntities.clear();
             relationships.clear();

package/dist/hooks/useFrames.svelte.js

@@ -2,9 +2,10 @@ import { MachineConnectionEvent, Transform } from '@viamrobotics/sdk';
 import { createRobotQuery, useConnectionStatus, useMachineStatus, useRobotClient, } from '@viamrobotics/svelte-sdk';
 import {} from 'koota';
 import { getContext, setContext, untrack } from 'svelte';
+import { Matrix4 } from 'three';
 import { resourceNameToColor, subtypeToColor } from '../color';
 import { hierarchy, traits, useWorld } from '../ecs';
-import { createPose } from '../transform';
+import { createPose, isPoseEqual, poseToMatrix } from '../transform';
 import { useConfigFrames } from './useConfigFrames.svelte';
 import { useEnvironment } from './useEnvironment.svelte';
 import { useFrameEditSession } from './useFrameEditSession.svelte';
@@ -171,34 +172,45 @@ export const provideFrames = (partID) => {
                     }
                     hierarchy.setParent(existing, parent);
                     if (color) {
-                        existing.set(traits.Color, color);
+                        const cur = existing.get(traits.Color);
+                        if (!cur || cur.r !== color.r || cur.g !== color.g || cur.b !== color.b) {
+                            existing.set(traits.Color, color);
+                        }
                     }
-                    if (center) {
+                    if (center && !isPoseEqual(existing.get(traits.Center), center)) {
                         existing.set(traits.Center, center);
                     }
                     traits.updateGeometryTrait(existing, frame.physicalObject);
                     if (!isEditMode && !partConfig.hasPendingSave) {
-                        existing.set(traits.Pose, pose);
+                        const baseline = existing.get(traits.Matrix);
+                        if (baseline) {
+                            poseToMatrix(pose, baseline);
+                            existing.changed(traits.Matrix);
+                        }
                     }
-                    if (!existing.has(traits.LivePose)) {
-                        existing.add(traits.LivePose(pose));
+                    if (!existing.has(traits.LiveMatrix)) {
+                        existing.add(traits.LiveMatrix(poseToMatrix(pose, new Matrix4())));
                     }
-                    // Skip the EditedPose overwrite while in edit mode. The merged
+                    // Skip the EditedMatrix overwrite while in edit mode. The merged
                     // `frames` source can differ from query.data once didRecentlyEdit
                     // flips (fragment overrides, round-trip drift), and writing those
                     // values would shift entities whose parents the user is portaling
                     // into — the gizmo's drag target moves underneath it. Once we're
                     // back in monitor mode, the next sync resumes the overwrite.
                     if (!isEditMode) {
-                        existing.set(traits.EditedPose, pose);
+                        const edited = existing.get(traits.EditedMatrix);
+                        if (edited) {
+                            poseToMatrix(pose, edited);
+                            existing.changed(traits.EditedMatrix);
+                        }
                     }
                     continue;
                 }
                 const entityTraits = [
                     traits.Name(name),
-                    traits.Pose(pose),
-                    traits.EditedPose(pose),
-                    traits.LivePose(pose),
+                    traits.Matrix(poseToMatrix(pose, new Matrix4())),
+                    traits.EditedMatrix(poseToMatrix(pose, new Matrix4())),
+                    traits.LiveMatrix(poseToMatrix(pose, new Matrix4())),
                     traits.FramesAPI,
                     traits.Transformable,
                     traits.ShowAxesHelper,

package/dist/hooks/useGeometries.svelte.js

@@ -1,4 +1,4 @@
-import { ArmClient, BaseClient, CameraClient, GantryClient, GripperClient } from '@viamrobotics/sdk';
+import { ArmClient, BaseClient, CameraClient, GantryClient, GenericComponentClient, GripperClient, } from '@viamrobotics/sdk';
 import { createResourceClient, createResourceQuery, useResourceNames, } from '@viamrobotics/svelte-sdk';
 import {} from 'koota';
 import { getContext, setContext, untrack } from 'svelte';
@@ -7,7 +7,7 @@ import { resourceColors } from '../color';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { hierarchy, traits, useWorld } from '../ecs';
 import { updateGeometryTrait } from '../ecs/traits';
-import { createPose } from '../transform';
+import { createPose, isPoseEqual } from '../transform';
 import { useEnvironment } from './useEnvironment.svelte';
 import { useLogs } from './useLogs.svelte';
 import { useResourceByName } from './useResourceByName.svelte';
@@ -24,6 +24,7 @@ export const provideGeometries = (partID) => {
     const cameras = useResourceNames(partID, 'camera');
     const grippers = useResourceNames(partID, 'gripper');
     const gantries = useResourceNames(partID, 'gantry');
+    const generics = useResourceNames(partID, 'generic');
     const settings = useSettings();
     const { refreshRates } = $derived(settings.current);
     const armClients = $derived(arms.current.map((arm) => createResourceClient(ArmClient, partID, () => arm.name)));
@@ -31,6 +32,9 @@ export const provideGeometries = (partID) => {
     const gripperClients = $derived(grippers.current.map((gripper) => createResourceClient(GripperClient, partID, () => gripper.name)));
     const cameraClients = $derived(cameras.current.map((camera) => createResourceClient(CameraClient, partID, () => camera.name)));
     const gantryClients = $derived(gantries.current.map((gantry) => createResourceClient(GantryClient, partID, () => gantry.name)));
+    const genericClients = $derived(generics.current
+        .filter((generic) => generic.type === 'component')
+        .map((generic) => createResourceClient(GenericComponentClient, partID, () => generic.name)));
     const interval = $derived(refreshRates[RefreshRates.poses]);
     const options = $derived({
         enabled: interval !== RefetchRates.OFF && environment.current.viewerMode === 'monitor',
@@ -41,12 +45,14 @@ export const provideGeometries = (partID) => {
     const gripperQueries = $derived(gripperClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
     const cameraQueries = $derived(cameraClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
     const gantryQueries = $derived(gantryClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
+    const genericQueries = $derived(genericClients.map((client) => [client.current?.name, createResourceQuery(client, 'getGeometries', () => options)]));
     const queries = $derived([
         ...armQueries,
         ...baseQueries,
         ...gripperQueries,
         ...cameraQueries,
         ...gantryQueries,
+        ...genericQueries,
     ]);
     $effect(() => {
         if (interval === RefetchRates.FPS_30 || interval === RefetchRates.FPS_60) {
@@ -91,7 +97,9 @@ export const provideGeometries = (partID) => {
                         const existing = entities.get(entityKey);
                         if (existing) {
                             hierarchy.setParent(existing, name);
-                            existing.set(traits.Center, center);
+                            if (!isPoseEqual(existing.get(traits.Center), center)) {
+                                existing.set(traits.Center, center);
+                            }
                             updateGeometryTrait(existing, geometry);
                             continue;
                         }

package/dist/hooks/usePartConfig.svelte.js

@@ -8,7 +8,7 @@ export const providePartConfig = (partID, params) => {
     const props = $derived(params());
     const config = $derived(props ? useEmbeddedPartConfig(props) : useStandalonePartConfig(partID));
     const getCurrent = () => {
-        return (config.current.toJson?.() ?? { components: [] });
+        return (config.current?.toJson?.() ?? { components: [] });
     };
     const current = $derived(getCurrent());
     const createFragmentFrame = (fragmentId, componentName) => {
@@ -204,9 +204,40 @@ export const usePartConfig = () => {
     return getContext(key);
 };
 const useEmbeddedPartConfig = (props) => {
+    let hasPendingSave = $state(false);
+    let prevIsDirty = false;
+    let cleanSnapshot;
+    const snapshot = (current) => {
+        const json = current?.toJson?.();
+        return json === undefined ? undefined : JSON.stringify(json);
+    };
+    /**
+     * The host app owns saving, and we aren't notified directly. Set hasPendingSave
+     * to watch isDirty: true -> false transitions, representing a save.
+     *
+     * `useFrames` clears the flag on the next `revision` change
+     * once the server reports the new framesystem.
+     */
+    $effect.pre(() => {
+        const dirty = props.isDirty;
+        const current = props.current;
+        if (prevIsDirty && !dirty) {
+            const next = snapshot(current);
+            if (next !== undefined && cleanSnapshot !== undefined && next !== cleanSnapshot) {
+                hasPendingSave = true;
+            }
+            cleanSnapshot = next;
+        }
+        else if (!prevIsDirty && !dirty) {
+            cleanSnapshot = snapshot(current);
+        }
+        prevIsDirty = dirty;
+    });
     return {
         hasEditPermissions: true,
-        hasPendingSave: false,
+        get hasPendingSave() {
+            return hasPendingSave;
+        },
         get isDirty() {
             return props.isDirty;
         },
@@ -220,8 +251,12 @@ const useEmbeddedPartConfig = (props) => {
             const struct = Struct.fromJson(config);
             return props.setLocalPartConfig(struct);
         },
-        clearPendingSave() { },
-        setPendingSave() { },
+        clearPendingSave() {
+            hasPendingSave = false;
+        },
+        setPendingSave() {
+            hasPendingSave = true;
+        },
     };
 };
 const useStandalonePartConfig = (partID) => {
@@ -278,10 +313,12 @@ const useStandalonePartConfig = (partID) => {
         const id = partID();
         if (lastPartID !== undefined && lastPartID !== id) {
             // Part changed: drop any in-memory edits/pending-save state from the
-            // previous part. `current` is left for the existing sync below to
-            // repopulate once the new part's networkPartConfig arrives.
+            // previous part, and clear `current` so consumers don't keep
+            // rendering the old config's frames while the new part loads
+            // (offline parts may never load, leaving the old frames forever).
             isDirty = false;
             hasPendingSave = false;
+            current = undefined;
         }
         lastPartID = id;
         if (!networkPartConfig || isDirty) {

package/dist/hooks/useWorldState.svelte.js

@@ -1,13 +1,14 @@
 import { useThrelte } from '@threlte/core';
 import { Struct, TransformChangeType, WorldStateStoreClient, } from '@viamrobotics/sdk';
 import { createResourceClient, createResourceQuery, createResourceStream, useResourceNames, } from '@viamrobotics/svelte-sdk';
+import { Matrix4 } from 'three';
 import { asFloat32Array, inMeters } from '../buffer';
 import { createChunkLoader } from '../chunking';
 import { drawTransform, updateMetadata } from '../draw';
 import { traits, useWorld } from '../ecs';
 import { isPointCloud } from '../geometry';
 import { metadataFromStruct } from '../metadata';
-import { createPose } from '../transform';
+import { createPose, poseToMatrix } from '../transform';
 import { usePartID } from './usePartID.svelte';
 import { useRelationships } from './useRelationships.svelte';
 export const provideWorldStates = () => {
@@ -133,7 +134,14 @@ const createWorldState = (client) => {
         for (const path of changes) {
             if (typeof path === 'string') {
                 if (path.startsWith('poseInObserverFrame.pose')) {
-                    entity.set(traits.Pose, transform.poseInObserverFrame?.pose ?? createPose());
+                    const matrix = entity.get(traits.Matrix);
+                    if (matrix) {
+                        poseToMatrix(createPose(transform.poseInObserverFrame?.pose), matrix);
+                        entity.changed(traits.Matrix);
+                    }
+                    else {
+                        entity.add(traits.Matrix(poseToMatrix(createPose(transform.poseInObserverFrame?.pose), new Matrix4())));
+                    }
                 }
                 else if (path.startsWith('physicalObject') && transform.physicalObject) {
                     traits.updateGeometryTrait(entity, transform.physicalObject);