@viamrobotics/motion-tools 1.13.1 → 1.15.0

package/dist/ecs/useQuery.svelte.js

@@ -1,5 +1,5 @@
+import { createQuery, $internal as internal } from 'koota';
 import { untrack } from 'svelte';
-import { $internal as internal, createQuery } from 'koota';
 import { useWorld } from './useWorld';
 export function useQuery(...parameters) {
     const world = useWorld();

package/dist/frame.js

@@ -1,7 +1,7 @@
 // TODO: replace with types exported from the sdk when created
 import { UuidTool } from 'uuid-tool';
-import { createPoseFromFrame } from './transform';
 import { createGeometryFromFrame } from './geometry';
+import { createPoseFromFrame } from './transform';
 export const createFrame = (geometry) => {
     return {
         parent: 'world',

package/dist/hooks/use3DModels.svelte.js

@@ -1,10 +1,10 @@
+import { isInstanceOf } from '@threlte/core';
 import { ArmClient } from '@viamrobotics/sdk';
 import { createResourceClient, useResourceNames } from '@viamrobotics/svelte-sdk';
 import { getContext, setContext } from 'svelte';
-import { useSettings } from './useSettings.svelte';
-import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
 import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js';
-import { isInstanceOf } from '@threlte/core';
+import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';
+import { useSettings } from './useSettings.svelte';
 const gltfLoader = new GLTFLoader();
 const dracoLoader = new DRACOLoader();
 dracoLoader.setDecoderPath('https://www.gstatic.com/draco/versioned/decoders/1.5.6/');
@@ -57,9 +57,7 @@ export const provide3DModels = (partID) => {
         }
     };
     $effect(() => {
-        const shouldFetchModels = settings.current.isLoaded &&
-            (settings.current.renderArmModels === 'model' ||
-                settings.current.renderArmModels === 'colliders+model');
+        const shouldFetchModels = settings.current.isLoaded && settings.current.renderArmModels.includes('model');
         if (shouldFetchModels) {
             fetch3DModels();
         }

package/dist/hooks/useConfigFrames.svelte.js

@@ -1,8 +1,8 @@
-import { useEnvironment } from './useEnvironment.svelte';
-import { usePartConfig } from './usePartConfig.svelte';
-import { createTransformFromFrame } from '../frame';
 import { Transform } from '@viamrobotics/sdk';
 import { getContext, setContext } from 'svelte';
+import { createTransformFromFrame } from '../frame';
+import { useEnvironment } from './useEnvironment.svelte';
+import { usePartConfig } from './usePartConfig.svelte';
 const key = Symbol('config-frames-context');
 export const provideConfigFrames = () => {
     const environment = useEnvironment();

package/dist/hooks/useDrawAPI.svelte.js

@@ -1,19 +1,19 @@
+import { useThrelte } from '@threlte/core';
+import {} from 'koota';
 import { getContext, setContext } from 'svelte';
 import { Color, Vector3, Vector4 } from 'three';
 import { NURBSCurve } from 'three/addons/curves/NURBSCurve.js';
-import { UuidTool } from 'uuid-tool';
 import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';
+import { UuidTool } from 'uuid-tool';
+import { createBufferGeometry, updateBufferGeometry } from '../attribute';
+import { STRIDE } from '../buffer';
+import { traits, useWorld } from '../ecs';
+import { createBox, createCapsule, createSphere } from '../geometry';
+import { parsePlyInput } from '../ply';
 import { createPose, createPoseFromFrame } from '../transform';
 import { useCameraControls } from './useControls.svelte';
-import { useWorld, traits } from '../ecs';
-import { useThrelte } from '@threlte/core';
-import {} from 'koota';
-import { parsePlyInput } from '../ply';
-import { useLogs } from './useLogs.svelte';
-import { createBox, createCapsule, createSphere } from '../geometry';
 import { useDrawConnectionConfig } from './useDrawConnectionConfig.svelte';
-import { createBufferGeometry, updateBufferGeometry } from '../attribute';
-import { STRIDE } from '../buffer';
+import { useLogs } from './useLogs.svelte';
 const colorUtil = new Color();
 const bufferTypes = {
     DRAW_POINTS: 0,

package/dist/hooks/useFramelessComponents.svelte.js

@@ -1,6 +1,6 @@
 import { getContext, setContext } from 'svelte';
-import { usePartConfig } from './usePartConfig.svelte';
 import { useFrames } from './useFrames.svelte';
+import { usePartConfig } from './usePartConfig.svelte';
 const key = Symbol('frameless-components-context');
 export const provideFramelessComponents = () => {
     const partConfig = usePartConfig();

package/dist/hooks/useFrames.svelte.js

@@ -1,14 +1,15 @@
-import { getContext, setContext, untrack } from 'svelte';
 import { MachineConnectionEvent, Transform } from '@viamrobotics/sdk';
-import { useRobotClient, createRobotQuery, useMachineStatus, useConnectionStatus, } from '@viamrobotics/svelte-sdk';
+import { createRobotQuery, useConnectionStatus, useMachineStatus, useRobotClient, } from '@viamrobotics/svelte-sdk';
 import {} from 'koota';
-import { useLogs } from './useLogs.svelte';
+import { getContext, setContext, untrack } from 'svelte';
 import { resourceNameToColor } from '../color';
-import { useEnvironment } from './useEnvironment.svelte';
-import { createPose } from '../transform';
-import { useResourceByName } from './useResourceByName.svelte';
 import { traits, useWorld } from '../ecs';
+import { updateGeometryTrait } from '../ecs/traits';
+import { createPose } from '../transform';
 import { useConfigFrames } from './useConfigFrames.svelte';
+import { useEnvironment } from './useEnvironment.svelte';
+import { useLogs } from './useLogs.svelte';
+import { useResourceByName } from './useResourceByName.svelte';
 const key = Symbol('frames-context');
 export const provideFrames = (partID) => {
     const configFrames = useConfigFrames();
@@ -69,15 +70,17 @@ export const provideFrames = (partID) => {
         }
     });
     $effect.pre(() => {
-        if (current.length === 0)
-            return;
         const currentResourcesByName = resourceByName.current;
+        const currentPartID = partID();
         // We only want to update whenever "current" or "resourceByName.current" changes
+        // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+        current.length;
         untrack(() => {
             const active = {};
             for (const frame of current) {
                 const name = frame.referenceFrame;
-                active[name] = true;
+                const entityKey = `${currentPartID}:${name}`;
+                active[entityKey] = true;
                 const parent = frame.poseInObserverFrame?.referenceFrame;
                 const pose = createPose(frame.poseInObserverFrame?.pose);
                 const center = frame.physicalObject?.center
@@ -85,7 +88,7 @@ export const provideFrames = (partID) => {
                     : undefined;
                 const resourceName = currentResourcesByName[frame.referenceFrame];
                 const color = resourceNameToColor(resourceName);
-                const existing = entities.get(name);
+                const existing = entities.get(entityKey);
                 if (existing) {
                     if (!parent || parent === 'world') {
                         existing.remove(traits.Parent);
@@ -102,11 +105,7 @@ export const provideFrames = (partID) => {
                     if (center) {
                         existing.set(traits.Center, center);
                     }
-                    existing.remove(traits.Box, traits.Sphere, traits.BufferGeometry, traits.Capsule);
-                    if (frame.physicalObject) {
-                        const geometry = traits.Geometry(frame.physicalObject);
-                        existing.add(geometry);
-                    }
+                    updateGeometryTrait(existing, frame.physicalObject);
                     existing.set(traits.EditedPose, pose);
                     continue;
                 }
@@ -130,13 +129,13 @@ export const provideFrames = (partID) => {
                     entityTraits.push(traits.Geometry(frame.physicalObject));
                 }
                 const entity = world.spawn(...entityTraits);
-                entities.set(name, entity);
+                entities.set(entityKey, entity);
             }
             // Clean up non-active entities
-            for (const [name, entity] of entities) {
-                if (!active[name]) {
+            for (const [entityKey, entity] of entities) {
+                if (!active[entityKey]) {
                     entity?.destroy();
-                    entities.delete(name);
+                    entities.delete(entityKey);
                     continue;
                 }
             }

package/dist/hooks/useGeometries.svelte.js

@@ -1,16 +1,17 @@
 import { ArmClient, CameraClient, GantryClient, GripperClient } from '@viamrobotics/sdk';
-import { untrack, setContext, getContext } from 'svelte';
-import { RefreshRates, useMachineSettings } from './useMachineSettings.svelte';
 import { createResourceClient, createResourceQuery, useResourceNames, } from '@viamrobotics/svelte-sdk';
-import { useLogs } from './useLogs.svelte';
-import { resourceColors } from '../color';
+import {} from 'koota';
+import { getContext, setContext, untrack } from 'svelte';
 import { Color } from 'three';
-import { useResourceByName } from './useResourceByName.svelte';
+import { resourceColors } from '../color';
+import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { traits, useWorld } from '../ecs';
-import {} from 'koota';
+import { updateGeometryTrait } from '../ecs/traits';
 import { createPose } from '../transform';
-import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { useEnvironment } from './useEnvironment.svelte';
+import { useLogs } from './useLogs.svelte';
+import { RefreshRates, useMachineSettings } from './useMachineSettings.svelte';
+import { useResourceByName } from './useResourceByName.svelte';
 const key = Symbol('geometries-context');
 const colorUtil = new Color();
 export const provideGeometries = (partID) => {
@@ -39,6 +40,7 @@ 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 queries = $derived([...armQueries, ...gripperQueries, ...cameraQueries, ...gantryQueries]);
     $effect(() => {
         if (interval === RefetchRates.FPS_30 || interval === RefetchRates.FPS_60) {
             return logs.add(`Fetching geometries every ${interval}ms...`);
@@ -56,49 +58,70 @@ export const provideGeometries = (partID) => {
             });
         }
     });
-    const queries = $derived([...armQueries, ...gripperQueries, ...cameraQueries, ...gantryQueries]);
     const entities = new Map();
+    const queryEntityKeys = new Map();
     $effect(() => {
-        const active = {};
+        const activeQueryKeys = new Set();
+        const currentPartID = partID();
         for (const [name, query] of queries) {
-            untrack(() => {
-                $effect(() => {
-                    if (name && query.data) {
-                        let index = 0;
-                        for (const geometry of query.data) {
-                            index += 1;
-                            const resourceName = resources.current[name];
-                            const label = geometry.label || `${name} geometry ${index}`;
-                            active[`${name}:${label}`] = true;
-                            const pose = createPose(geometry.center);
-                            const subtype = resourceName?.subtype;
-                            const existing = entities.get(`${name}:${label}`);
-                            if (existing) {
-                                existing.set(traits.Pose, pose);
-                                continue;
-                            }
-                            const entityTraits = [
-                                traits.Parent(name),
-                                traits.Name(label),
-                                traits.Pose(pose),
-                                traits.GeometriesAPI,
-                                traits.Geometry(geometry),
-                            ];
-                            if (subtype) {
-                                entityTraits.push(traits.Color(subtype ? colorUtil.set(resourceColors[subtype]) : undefined));
-                            }
-                            const entity = world.spawn(...entityTraits);
-                            entities.set(`${name}:${label}`, entity);
+            if (!name) {
+                continue;
+            }
+            const queryKey = `${currentPartID}:${name}`;
+            activeQueryKeys.add(queryKey);
+            $effect(() => {
+                const nextKeys = new Set();
+                const resourceName = resources.current[name];
+                const subtype = resourceName?.subtype;
+                if (query.data) {
+                    let index = 0;
+                    for (const geometry of query.data) {
+                        index += 1;
+                        const label = geometry.label || `${name} geometry ${index}`;
+                        const entityKey = `${currentPartID}:${name}:${label}`;
+                        nextKeys.add(entityKey);
+                        const center = createPose(geometry.center);
+                        const existing = entities.get(entityKey);
+                        if (existing) {
+                            existing.set(traits.Center, center);
+                            updateGeometryTrait(existing, geometry);
+                            continue;
+                        }
+                        const entityTraits = [
+                            traits.Parent(name),
+                            traits.Name(label),
+                            traits.Center(center),
+                            traits.GeometriesAPI,
+                            traits.Geometry(geometry),
+                        ];
+                        if (subtype) {
+                            entityTraits.push(traits.Color(subtype ? colorUtil.set(resourceColors[subtype]) : undefined));
                         }
+                        const entity = world.spawn(...entityTraits);
+                        entities.set(entityKey, entity);
                     }
-                });
+                }
+                const prevKeys = queryEntityKeys.get(queryKey) ?? new Set();
+                // Remove entities no longer present for this specific query
+                for (const key of prevKeys) {
+                    if (!nextKeys.has(key)) {
+                        entities.get(key)?.destroy();
+                        entities.delete(key);
+                    }
+                }
+                queryEntityKeys.set(queryKey, nextKeys);
             });
         }
-        // Clean up non-active entities
-        for (const [label, entity] of entities) {
-            if (!active[label]) {
-                entity?.destroy();
-                entities.delete(label);
+        // Clean up owners whose queries disappeared entirely
+        for (const [queryKey, keys] of queryEntityKeys) {
+            if (!activeQueryKeys.has(queryKey)) {
+                for (const key of keys) {
+                    const entity = entities.get(key);
+                    if (entity && world.has(entity))
+                        entity.destroy();
+                    entities.delete(key);
+                }
+                queryEntityKeys.delete(queryKey);
             }
         }
     });

package/dist/hooks/useMouseRaycaster.svelte.d.ts

@@ -1,4 +1,4 @@
-import { Raycaster, type Intersection } from 'three';
+import { type Intersection, Raycaster } from 'three';
 type EventNames = 'click' | 'move' | 'pointerenter' | 'pointerleave';
 interface RaycastEvent<T extends EventNames> {
     type: T;

package/dist/hooks/useMouseRaycaster.svelte.js

@@ -1,5 +1,5 @@
-import { Vector2, Raycaster, EventDispatcher } from 'three';
 import { useThrelte } from '@threlte/core';
+import { EventDispatcher, Raycaster, Vector2 } from 'three';
 const pointerDown = new Vector2();
 const pointerUp = new Vector2();
 const pointerMove = new Vector2();

package/dist/hooks/usePartConfig.svelte.d.ts

@@ -1,5 +1,5 @@
+import { Pose, Struct } from '@viamrobotics/sdk';
 import { type Frame } from '../frame';
-import { Struct, Pose } from '@viamrobotics/sdk';
 export interface PartConfig {
     components: {
         name: string;

package/dist/hooks/usePartConfig.svelte.js

@@ -1,8 +1,8 @@
-import { createFrame } from '../frame';
-import { createPoseFromFrame } from '../transform';
-import { Struct, Pose } from '@viamrobotics/sdk';
+import { Pose, Struct } from '@viamrobotics/sdk';
 import { createAppMutation, createAppQuery } from '@viamrobotics/svelte-sdk';
 import { getContext, setContext } from 'svelte';
+import { createFrame } from '../frame';
+import { createPoseFromFrame } from '../transform';
 const key = Symbol('part-config-context');
 export const providePartConfig = (partID, params) => {
     const props = $derived(params());

package/dist/hooks/usePointcloudObjects.svelte.js

@@ -1,14 +1,15 @@
 import { VisionClient } from '@viamrobotics/sdk';
 import { createResourceClient, createResourceQuery, useResourceNames, } from '@viamrobotics/svelte-sdk';
-import { RefreshRates, useMachineSettings } from './useMachineSettings.svelte';
-import { useLogs } from './useLogs.svelte';
-import { parsePcdInWorker } from '../lib';
 import { getContext, setContext, untrack } from 'svelte';
-import { traits, useWorld } from '../ecs';
 import { createBufferGeometry, updateBufferGeometry } from '../attribute';
-import { useEnvironment } from './useEnvironment.svelte';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
+import { traits, useWorld } from '../ecs';
+import { updateGeometryTrait } from '../ecs/traits';
+import { parsePcdInWorker } from '../lib';
 import { createPose } from '../transform';
+import { useEnvironment } from './useEnvironment.svelte';
+import { useLogs } from './useLogs.svelte';
+import { RefreshRates, useMachineSettings } from './useMachineSettings.svelte';
 const key = Symbol('pointcloud-object-context');
 export const providePointcloudObjects = (partID) => {
     const world = useWorld();
@@ -57,8 +58,8 @@ export const providePointcloudObjects = (partID) => {
     const logs = useLogs();
     const interval = $derived(refreshRates.get(RefreshRates.pointclouds));
     const options = $derived({
-        enabled: interval !== -1,
-        refetchInterval: (interval === 0 ? false : interval),
+        enabled: interval !== RefetchRates.OFF,
+        refetchInterval: (interval === RefetchRates.MANUAL ? false : interval),
     });
     const queries = $derived(enabledClients.map((client) => [
         client.current.name,
@@ -79,73 +80,117 @@ export const providePointcloudObjects = (partID) => {
         }
     });
     const entities = new Map();
+    const queryEntityKeys = new Map();
+    const destroyEntity = (key) => {
+        const entity = entities.get(key);
+        if (entity) {
+            if (world.has(entity))
+                entity.destroy();
+            entities.delete(key);
+        }
+    };
     $effect(() => {
-        const active = {};
+        const currentPartID = partID();
+        const activeQueryKeys = new Set();
         for (const [name, query] of queries) {
-            untrack(() => {
-                $effect(() => {
-                    const { data } = query;
-                    if (!data || data.length === 0)
-                        return;
-                    let index = 0;
-                    for (const { geometries: geometriesInFrame, pointCloud } of data) {
-                        if (pointCloud.length > 0) {
-                            parsePcdInWorker(pointCloud).then(({ positions, colors }) => {
-                                const poincloudLabel = `${name} pointcloud ${index + 1}`;
-                                const existing = entities.get(poincloudLabel);
-                                if (existing) {
-                                    const geometry = existing.get(traits.BufferGeometry);
-                                    if (geometry) {
-                                        updateBufferGeometry(geometry, positions, colors);
-                                    }
-                                }
-                                else {
-                                    const geometry = createBufferGeometry(positions, colors);
-                                    const entity = world.spawn(traits.Name(poincloudLabel), traits.BufferGeometry(geometry), traits.Points);
-                                    entities.set(poincloudLabel, entity);
-                                }
-                            });
+            const queryKey = `${currentPartID}:${name}`;
+            activeQueryKeys.add(queryKey);
+            $effect(() => {
+                const { data } = query;
+                let disposed = false;
+                const nextKeys = new Set();
+                const reconcileRemovedKeys = () => {
+                    const prevKeys = queryEntityKeys.get(queryKey) ?? new Set();
+                    for (const key of prevKeys) {
+                        if (!nextKeys.has(key)) {
+                            destroyEntity(key);
                         }
-                        if (geometriesInFrame) {
-                            let geometryIndex = 0;
-                            for (const geometry of geometriesInFrame.geometries) {
-                                const geometryLabel = `${name} pointcloud ${index} geometry ${geometryIndex + 1}`;
-                                const pose = createPose(geometry.center);
-                                active[geometryLabel] = true;
-                                const existing = entities.get(geometryLabel);
-                                if (existing) {
-                                    existing.set(traits.Pose, pose);
+                    }
+                    queryEntityKeys.set(queryKey, new Set(nextKeys));
+                };
+                if (!data || data.length === 0) {
+                    reconcileRemovedKeys();
+                    return () => {
+                        disposed = true;
+                    };
+                }
+                let index = 0;
+                for (const { geometries: geometriesInFrame, pointCloud } of data) {
+                    if (pointCloud.length > 0) {
+                        const pointcloudLabel = `${name} pointcloud ${index + 1}`;
+                        nextKeys.add(pointcloudLabel);
+                        parsePcdInWorker(pointCloud)
+                            .then(({ positions, colors }) => {
+                            if (disposed) {
+                                return;
+                            }
+                            if (!nextKeys.has(pointcloudLabel)) {
+                                return;
+                            }
+                            const existing = entities.get(pointcloudLabel);
+                            if (existing) {
+                                const geometry = existing.get(traits.BufferGeometry);
+                                if (geometry) {
+                                    updateBufferGeometry(geometry, positions, colors);
                                 }
-                                else {
-                                    const entityTraits = [
-                                        traits.Name(geometryLabel),
-                                        traits.Pose(pose),
-                                        traits.GeometriesAPI,
-                                        traits.Geometry(geometry),
-                                        traits.Opacity(0.2),
-                                        traits.Color({ r: 0, g: 1, b: 0 }),
-                                    ];
-                                    if (geometriesInFrame.referenceFrame) {
-                                        entityTraits.push(traits.Parent(geometriesInFrame.referenceFrame));
-                                    }
-                                    const entity = world.spawn(...entityTraits);
-                                    entities.set(geometryLabel, entity);
+                            }
+                            else {
+                                const geometry = createBufferGeometry(positions, colors);
+                                const entity = world.spawn(traits.Name(pointcloudLabel), traits.BufferGeometry(geometry), traits.Points);
+                                entities.set(pointcloudLabel, entity);
+                            }
+                        })
+                            .catch((error) => {
+                            if (disposed) {
+                                return;
+                            }
+                            logs.add(error?.reason ?? error?.message ?? 'Failed to parse pointcloud', 'error');
+                        });
+                    }
+                    if (geometriesInFrame) {
+                        let geometryIndex = 0;
+                        for (const geometry of geometriesInFrame.geometries) {
+                            const geometryLabel = `${name} pointcloud ${index + 1} geometry ${geometryIndex + 1}`;
+                            nextKeys.add(geometryLabel);
+                            const center = createPose(geometry.center);
+                            const existing = entities.get(geometryLabel);
+                            if (existing) {
+                                existing.set(traits.Center, center);
+                                updateGeometryTrait(existing, geometry);
+                            }
+                            else {
+                                const entityTraits = [
+                                    traits.Name(geometryLabel),
+                                    traits.Center(center),
+                                    traits.GeometriesAPI,
+                                    traits.Geometry(geometry),
+                                    traits.Opacity(0.2),
+                                    traits.Color({ r: 0, g: 1, b: 0 }),
+                                ];
+                                if (geometriesInFrame.referenceFrame) {
+                                    entityTraits.push(traits.Parent(geometriesInFrame.referenceFrame));
                                 }
-                                geometryIndex += 1;
+                                const entity = world.spawn(...entityTraits);
+                                entities.set(geometryLabel, entity);
                             }
+                            geometryIndex += 1;
                         }
-                        index += 1;
                     }
-                });
+                    index += 1;
+                }
+                reconcileRemovedKeys();
+                return () => {
+                    disposed = true;
+                };
             });
         }
-        // Clean up old entities
-        for (const [label, entity] of entities) {
-            if (!active[label]) {
-                if (world.has(entity)) {
-                    entity.destroy();
+        // cleanup queries that disappeared entirely
+        for (const [queryKey, keys] of queryEntityKeys) {
+            if (!activeQueryKeys.has(queryKey)) {
+                for (const key of keys) {
+                    destroyEntity(key);
                 }
-                entities.delete(label);
+                queryEntityKeys.delete(queryKey);
             }
         }
     });