@viamrobotics/motion-tools 0.15.0 → 0.15.2

package/dist/color.d.ts

@@ -1,4 +1,5 @@
 import { Color, type ColorRepresentation, type RGB } from 'three';
+import { ResourceName } from '@viamrobotics/sdk';
 /**
  * Darkens a THREE.Color by a given percentage while preserving hue.
  * @param color The original THREE.Color instance.
@@ -6,6 +7,7 @@ import { Color, type ColorRepresentation, type RGB } from 'three';
  * @returns A new THREE.Color instance with the darkened color.
  */
 export declare const darkenColor: (value: ColorRepresentation, percent: number) => Color;
+export declare const resourceNameToColor: (resourceName?: ResourceName) => Color | undefined;
 export declare const colors: {
     readonly default: string;
 };

package/dist/color.js

@@ -1,6 +1,7 @@
 import { Color } from 'three';
 import twColors from 'tailwindcss/colors';
 import { isNumber } from 'lodash-es';
+import { ResourceName } from '@viamrobotics/sdk';
 // Step 3: linear sRGB → sRGB
 const linearToSrgb = (x) => {
     return x <= 0.0031308 ? 12.92 * x : 1.055 * Math.pow(x, 1 / 2.4) - 0.055;
@@ -53,6 +54,11 @@ export const darkenColor = (value, percent) => {
     return new Color().setHSL(hsl.h, hsl.s, hsl.l);
 };
 const darkness = '600';
+export const resourceNameToColor = (resourceName) => {
+    return resourceName
+        ? new Color(resourceColors[resourceName.subtype])
+        : undefined;
+};
 export const colors = {
     default: oklchToHex(twColors.red[darkness]),
 };

package/dist/components/SceneProviders.svelte

@@ -18,6 +18,7 @@
 	import { provideArmClient } from '../hooks/useArmClient.svelte'
 	import { provideArrows } from '../hooks/useArrows.svelte'
 	import { provideFramelessComponents } from '../hooks/useFramelessComponents.svelte'
+	import { provideResourceByName } from '../hooks/useResourceByName.svelte'
 	interface Props {
 		children: Snippet<[{ focus: boolean }]>
 	}
@@ -36,13 +37,14 @@
 	provideStaticGeometries()
 	provideDrawAPI()
 
+	provideResourceByName(() => partID.current)
 	provideFrames(() => partID.current)
 	provideGeometries(() => partID.current)
 	providePointclouds(() => partID.current)
 	provideMotionClient(() => partID.current)
+	provideArmClient(() => partID.current)
 	provideObjects()
 	provideWorldStates()
-	provideArmClient(() => partID.current)
 	provideFramelessComponents()
 
 	const { focus } = provideSelection()

package/dist/geometry.d.ts

@@ -1,2 +1,4 @@
 import type { Geometry } from '@viamrobotics/sdk';
+import type { Frame } from './frame';
 export declare const createGeometry: (geometryType?: Geometry["geometryType"], label?: string) => Geometry;
+export declare const createGeometryFromFrame: (frame: Frame) => import("@viamrobotics/sdk").PlainMessage<import("@viamrobotics/sdk/dist/gen/common/v1/common_pb").Geometry> | undefined;

package/dist/geometry.js

@@ -6,3 +6,37 @@ export const createGeometry = (geometryType, label = '') => {
         geometryType: geometryType ?? { case: undefined, value: undefined },
     };
 };
+export const createGeometryFromFrame = (frame) => {
+    if (!frame.geometry) {
+        return;
+    }
+    if (frame.geometry.type === 'box') {
+        return createGeometry({
+            case: 'box',
+            value: {
+                dimsMm: {
+                    x: frame.geometry.x,
+                    y: frame.geometry.y,
+                    z: frame.geometry.z,
+                },
+            },
+        });
+    }
+    if (frame.geometry.type === 'sphere') {
+        return createGeometry({
+            case: 'sphere',
+            value: {
+                radiusMm: frame.geometry.r,
+            },
+        });
+    }
+    if (frame.geometry.type === 'capsule') {
+        return createGeometry({
+            case: 'capsule',
+            value: {
+                radiusMm: frame.geometry.r,
+                lengthMm: frame.geometry.l,
+            },
+        });
+    }
+};

package/dist/hooks/useFrames.svelte.js

@@ -1,16 +1,16 @@
 import { getContext, setContext, untrack } from 'svelte';
-import { useRobotClient, createRobotQuery, useMachineStatus, useResourceNames, } from '@viamrobotics/svelte-sdk';
+import { useRobotClient, createRobotQuery, useMachineStatus } from '@viamrobotics/svelte-sdk';
 import { WorldObject } from '../WorldObject.svelte';
 import { useLogs } from './useLogs.svelte';
-import { resourceColors } from '../color';
+import { resourceNameToColor } from '../color';
 import { usePartConfig } from './usePartConfig.svelte';
-import { Color } from 'three';
 import { useEnvironment } from './useEnvironment.svelte';
 import { createPoseFromFrame } from '../transform';
-import { observe } from '@threlte/core';
+import { createGeometryFromFrame } from '../geometry';
+import { useResourceByName } from './useResourceByName.svelte';
 const key = Symbol('frames-context');
 export const provideFrames = (partID) => {
-    const resourceNames = useResourceNames(partID);
+    const resourceByName = useResourceByName();
     const client = useRobotClient(partID);
     const machineStatus = useMachineStatus(partID);
     const logs = useLogs();
@@ -18,8 +18,10 @@ export const provideFrames = (partID) => {
     const revision = $derived(machineStatus.current?.config?.revision);
     const partConfig = usePartConfig();
     const environment = useEnvironment();
-    observe.pre(() => [revision], () => {
-        untrack(() => query.current).refetch();
+    $effect.pre(() => {
+        if (revision) {
+            untrack(() => query.current).refetch();
+        }
         logs.add('Fetching frames...');
     });
     $effect.pre(() => {
@@ -36,13 +38,10 @@ export const provideFrames = (partID) => {
             if (frame === undefined) {
                 continue;
             }
-            const resourceName = resourceNames.current.find((item) => item.name === frame.referenceFrame);
+            const resourceName = resourceByName.current[frame.referenceFrame];
             const frameName = frame.referenceFrame ? frame.referenceFrame : 'Unnamed frame';
-            objects.push(new WorldObject(frameName, frame.poseInObserverFrame?.pose, frame.poseInObserverFrame?.referenceFrame, frame.physicalObject, resourceName
-                ? {
-                    color: new Color(resourceColors[resourceName.subtype]),
-                }
-                : undefined));
+            const color = resourceNameToColor(resourceName);
+            objects.push(new WorldObject(frameName, frame.poseInObserverFrame?.pose, frame.poseInObserverFrame?.referenceFrame, frame.physicalObject, color ? { color } : undefined));
         }
         return objects;
     });
@@ -56,44 +55,7 @@ export const provideFrames = (partID) => {
         worldObject.referenceFrame = component.frame.parent;
         worldObject.localEditedPose = createPoseFromFrame(component.frame);
         if (component.frame.geometry) {
-            switch (component.frame.geometry.type) {
-                case 'box':
-                    worldObject.geometry = {
-                        ...worldObject.geometry,
-                        geometryType: {
-                            case: 'box',
-                            value: {
-                                dimsMm: {
-                                    x: component.frame.geometry.x,
-                                    y: component.frame.geometry.y,
-                                    z: component.frame.geometry.z,
-                                },
-                            },
-                        },
-                    };
-                    break;
-                case 'sphere':
-                    worldObject.geometry = {
-                        ...worldObject.geometry,
-                        geometryType: { case: 'sphere', value: { radiusMm: component.frame.geometry.r } },
-                    };
-                    break;
-                case 'capsule':
-                    worldObject.geometry = {
-                        ...worldObject.geometry,
-                        geometryType: {
-                            case: 'capsule',
-                            value: {
-                                radiusMm: component.frame.geometry.r,
-                                lengthMm: component.frame.geometry.l,
-                            },
-                        },
-                    };
-                    break;
-                default:
-                    worldObject.geometry = undefined;
-                    break;
-            }
+            worldObject.geometry = createGeometryFromFrame(component.frame);
         }
         else {
             worldObject.geometry = undefined;

package/dist/hooks/usePose.svelte.js

@@ -21,23 +21,15 @@ export const usePose = (name, parent) => {
     const options = $derived(queryOptions({
         enabled: interval !== -1 &&
             client.current !== undefined &&
-            resource !== undefined &&
             environment.current.viewerMode === 'monitor',
         refetchInterval: interval === 0 ? false : interval,
-        queryKey: [
-            'partID',
-            partID.current,
-            client.current?.name,
-            'getPose',
-            resource?.name,
-            parent(),
-        ],
+        queryKey: ['partID', partID.current, client.current?.name, 'getPose', name(), parent()],
         queryFn: async () => {
-            if (!client.current || !resource) {
+            if (!client.current) {
                 throw new Error('No client');
             }
             const resolvedParent = parentResource?.subtype === 'arm' ? `${parent()}_origin` : parent();
-            const pose = await client.current.getPose(resource.name, resolvedParent ?? 'world', []);
+            const pose = await client.current.getPose(name(), resolvedParent ?? 'world', []);
             return pose;
         },
     }));
@@ -49,6 +41,10 @@ export const usePose = (name, parent) => {
     });
     return {
         get current() {
+            /**
+             * Do not return the pose of an arm because in this case the pose represents
+             * the end effector frame and not the origin frame
+             */
             if (resource?.subtype === 'arm') {
                 return;
             }

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

@@ -0,0 +1,7 @@
+import type { ResourceName } from '@viamrobotics/sdk';
+interface Context {
+    current: Record<string, ResourceName>;
+}
+export declare const provideResourceByName: (partID: () => string) => void;
+export declare const useResourceByName: () => Context;
+export {};

package/dist/hooks/useResourceByName.svelte.js

@@ -0,0 +1,21 @@
+import { useResourceNames } from '@viamrobotics/svelte-sdk';
+import { getContext, setContext } from 'svelte';
+const key = Symbol('resource-by-name-context');
+export const provideResourceByName = (partID) => {
+    const resourceNames = useResourceNames(partID);
+    const resourceByName = $derived.by(() => {
+        const results = {};
+        for (const resourceName of resourceNames.current) {
+            results[resourceName.name] = resourceName;
+        }
+        return results;
+    });
+    setContext(key, {
+        get current() {
+            return resourceByName;
+        },
+    });
+};
+export const useResourceByName = () => {
+    return getContext(key);
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@viamrobotics/motion-tools",
-  "version": "0.15.0",
+  "version": "0.15.2",
   "description": "Motion visualization with Viam",
   "license": "Apache-2.0",
   "type": "module",