@viamrobotics/motion-tools 1.13.0 → 1.13.1

package/dist/components/xr/XRToast.svelte

@@ -132,7 +132,8 @@
 		const iconCenterX = accentBarWidth + 30
 		const textStartX = accentBarWidth + 56
 
-		toasts.forEach((toast, index) => {
+		let index = 0
+		for (const toast of toasts) {
 			const y = index * (TOAST_HEIGHT + TOAST_GAP)
 			const style = VARIANT_STYLES[toast.variant]
 
@@ -165,7 +166,9 @@
 			ctx.font = '28px sans-serif'
 			ctx.textBaseline = 'middle'
 			ctx.fillText(toast.message, textStartX, y + TOAST_HEIGHT / 2)
-		})
+
+			index += 1
+		}
 
 		texture.needsUpdate = true
 	}
@@ -189,12 +192,14 @@
 		renderToasts(toasts)
 	})
 
+	const dispose = () => {
+		texture.dispose()
+		untrack(() => geometry?.dispose())
+	}
+
 	// Cleanup
 	$effect(() => {
-		return () => {
-			texture.dispose()
-			untrack(() => geometry?.dispose())
-		}
+		return dispose
 	})
 </script>
 

package/dist/ecs/relations.d.ts

@@ -1,3 +1,4 @@
+export declare const ChildOf: import("koota").Relation<import("koota").Trait<Record<string, never>>>;
 export declare const SubEntityLinkType: {
     readonly HoverLink: "HoverLink";
 };

package/dist/ecs/relations.js

@@ -1,4 +1,5 @@
 import { relation } from 'koota';
+export const ChildOf = relation({ exclusive: true });
 export const SubEntityLinkType = {
     HoverLink: 'HoverLink',
 };

package/dist/ecs/useQuery.svelte.js

@@ -31,11 +31,11 @@ export function useQuery(...parameters) {
             };
         });
     });
+    const handler = () => {
+        version += 1;
+    };
     // Force reattaching event listeners when the world is reset.
     $effect(() => {
-        const handler = () => {
-            version += 1;
-        };
         world[internal].resetSubscriptions.add(handler);
         return () => {
             world[internal].resetSubscriptions.delete(handler);

package/dist/format.js

@@ -2,7 +2,7 @@ export const formatNumeric = (value, decimals = 2) => {
     if (value === undefined) {
         return '––';
     }
-    if (isNaN(value)) {
+    if (Number.isNaN(value)) {
         return 'NaN';
     }
     if (value === Number.POSITIVE_INFINITY) {

package/dist/hooks/use3DModels.svelte.js

@@ -18,45 +18,45 @@ export const provide3DModels = (partID) => {
     const clients = $derived(armClients.filter((client) => {
         return arms.current.some((arm) => arm.name === client.current?.name);
     }));
-    $effect(() => {
-        const fetch3DModels = async () => {
-            const next = {};
-            for (const client of clients) {
-                if (!client.current)
+    const fetch3DModels = async () => {
+        const next = {};
+        for (const client of clients) {
+            if (!client.current)
+                continue;
+            try {
+                const geometries = await client.current.getGeometries();
+                if (geometries.length === 0) {
                     continue;
-                try {
-                    const geometries = await client.current.getGeometries();
-                    if (geometries.length === 0) {
-                        continue;
-                    }
-                    const geometryLabel = geometries[0].label;
-                    const prefix = geometryLabel.split(':')[0];
-                    const models = await client.current.get3DModels();
-                    if (!(prefix in next)) {
-                        next[prefix] = {};
-                    }
-                    for (const [id, model] of Object.entries(models)) {
-                        const arrayBuffer = model.mesh.buffer.slice(model.mesh.byteOffset, model.mesh.byteOffset + model.mesh.byteLength);
-                        const gltfModel = await gltfLoader.parseAsync(arrayBuffer, '');
-                        next[prefix][id] = gltfModel.scene;
-                        gltfModel.scene.traverse((object) => {
-                            if (isInstanceOf(object, 'Mesh')) {
-                                const { material } = object;
-                                if (isInstanceOf(material, 'MeshStandardMaterial')) {
-                                    material.roughness = 0.3;
-                                    material.metalness = 0.1;
-                                }
-                            }
-                        });
-                    }
-                    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`);
+                const geometryLabel = geometries[0].label;
+                const prefix = geometryLabel.split(':')[0];
+                const models = await client.current.get3DModels();
+                if (!(prefix in next)) {
+                    next[prefix] = {};
+                }
+                for (const [id, model] of Object.entries(models)) {
+                    const arrayBuffer = model.mesh.buffer.slice(model.mesh.byteOffset, model.mesh.byteOffset + model.mesh.byteLength);
+                    const gltfModel = await gltfLoader.parseAsync(arrayBuffer, '');
+                    next[prefix][id] = gltfModel.scene;
+                    gltfModel.scene.traverse((object) => {
+                        if (isInstanceOf(object, 'Mesh')) {
+                            const { material } = object;
+                            if (isInstanceOf(material, 'MeshStandardMaterial')) {
+                                material.roughness = 0.3;
+                                material.metalness = 0.1;
+                            }
+                        }
+                    });
                 }
+                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`);
+            }
+        }
+    };
+    $effect(() => {
         const shouldFetchModels = settings.current.isLoaded &&
             (settings.current.renderArmModels === 'model' ||
                 settings.current.renderArmModels === 'colliders+model');

package/dist/hooks/useConfigFrames.svelte.js

@@ -8,12 +8,7 @@ export const provideConfigFrames = () => {
     const environment = useEnvironment();
     const partConfig = usePartConfig();
     $effect(() => {
-        if (partConfig.isDirty) {
-            environment.current.viewerMode = 'edit';
-        }
-        else {
-            environment.current.viewerMode = 'monitor';
-        }
+        environment.current.viewerMode = partConfig.isDirty ? 'edit' : 'monitor';
     });
     const [configFrames, configUnsetFrameNames] = $derived.by(() => {
         const { components } = partConfig.current;
@@ -74,7 +69,7 @@ export const provideConfigFrames = () => {
                 }
             }
         }
-        return Array.from(validFrames);
+        return [...validFrames];
     };
     const unsetFrames = $derived([...new Set([...configUnsetFrameNames, ...fragmentUnsetFrameNames])]);
     setContext(key, {

package/dist/hooks/useDrawAPI.svelte.js

@@ -39,7 +39,7 @@ const tryParse = (json) => {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const lowercaseKeys = (obj) => {
     if (Array.isArray(obj)) {
-        return obj.map(lowercaseKeys);
+        return obj.map((item) => lowercaseKeys(item));
     }
     else if (obj && typeof obj === 'object' && obj.constructor === Object) {
         return Object.fromEntries(Object.entries(obj).map(([k, v]) => [k.toLowerCase(), lowercaseKeys(v)]));

package/dist/hooks/useFramelessComponents.svelte.js

@@ -12,7 +12,7 @@ export const provideFramelessComponents = () => {
             .map((component) => component.name) ?? [];
         const fragmentComponentsWithNoFrame = [];
         for (const fragmentComponentName of Object.keys(partConfig.componentNameToFragmentId)) {
-            if (frames.current.find((frame) => frame.referenceFrame === fragmentComponentName)) {
+            if (frames.current.some((frame) => frame.referenceFrame === fragmentComponentName)) {
                 continue;
             }
             fragmentComponentsWithNoFrame.push(fragmentComponentName);

package/dist/hooks/useFrames.svelte.js

@@ -1,6 +1,7 @@
 import { getContext, setContext, untrack } from 'svelte';
 import { MachineConnectionEvent, Transform } from '@viamrobotics/sdk';
 import { useRobotClient, createRobotQuery, useMachineStatus, useConnectionStatus, } from '@viamrobotics/svelte-sdk';
+import {} from 'koota';
 import { useLogs } from './useLogs.svelte';
 import { resourceNameToColor } from '../color';
 import { useEnvironment } from './useEnvironment.svelte';
@@ -68,72 +69,78 @@ export const provideFrames = (partID) => {
         }
     });
     $effect.pre(() => {
-        for (const frame of current) {
-            if (frame === undefined) {
-                continue;
-            }
-            const name = frame.referenceFrame;
-            const parent = frame.poseInObserverFrame?.referenceFrame;
-            const pose = createPose(frame.poseInObserverFrame?.pose);
-            const center = frame.physicalObject?.center
-                ? createPose(frame.physicalObject.center)
-                : undefined;
-            const resourceName = resourceByName.current[frame.referenceFrame];
-            const color = resourceNameToColor(resourceName);
-            const existing = entities.get(name);
-            if (existing) {
-                if (!parent || parent === 'world') {
-                    existing.remove(traits.Parent);
+        if (current.length === 0)
+            return;
+        const currentResourcesByName = resourceByName.current;
+        // We only want to update whenever "current" or "resourceByName.current" changes
+        untrack(() => {
+            const active = {};
+            for (const frame of current) {
+                const name = frame.referenceFrame;
+                active[name] = true;
+                const parent = frame.poseInObserverFrame?.referenceFrame;
+                const pose = createPose(frame.poseInObserverFrame?.pose);
+                const center = frame.physicalObject?.center
+                    ? createPose(frame.physicalObject.center)
+                    : undefined;
+                const resourceName = currentResourcesByName[frame.referenceFrame];
+                const color = resourceNameToColor(resourceName);
+                const existing = entities.get(name);
+                if (existing) {
+                    if (!parent || parent === 'world') {
+                        existing.remove(traits.Parent);
+                    }
+                    else if (parent && existing.has(traits.Parent)) {
+                        existing.set(traits.Parent, parent);
+                    }
+                    else {
+                        existing.add(traits.Parent(parent));
+                    }
+                    if (color) {
+                        existing.set(traits.Color, color);
+                    }
+                    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);
+                    }
+                    existing.set(traits.EditedPose, pose);
+                    continue;
                 }
-                else if (parent && existing.has(traits.Parent)) {
-                    existing.set(traits.Parent, parent);
-                }
-                else {
-                    existing.add(traits.Parent(parent));
+                const entityTraits = [
+                    traits.Name(name),
+                    traits.Pose(pose),
+                    traits.EditedPose(pose),
+                    traits.FramesAPI,
+                    traits.ShowAxesHelper,
+                ];
+                if (parent && parent !== 'world') {
+                    entityTraits.push(traits.Parent(parent));
                 }
                 if (color) {
-                    existing.set(traits.Color, color);
+                    entityTraits.push(traits.Color(color));
                 }
                 if (center) {
-                    existing.set(traits.Center, center);
+                    entityTraits.push(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);
+                    entityTraits.push(traits.Geometry(frame.physicalObject));
                 }
-                existing.set(traits.EditedPose, pose);
-                continue;
-            }
-            const entityTraits = [
-                traits.Name(name),
-                traits.Pose(pose),
-                traits.EditedPose(pose),
-                traits.FramesAPI,
-                traits.ShowAxesHelper,
-            ];
-            if (parent && parent !== 'world') {
-                entityTraits.push(traits.Parent(parent));
+                const entity = world.spawn(...entityTraits);
+                entities.set(name, entity);
             }
-            if (color) {
-                entityTraits.push(traits.Color(color));
-            }
-            if (center) {
-                entityTraits.push(traits.Center(center));
-            }
-            if (frame.physicalObject) {
-                entityTraits.push(traits.Geometry(frame.physicalObject));
-            }
-            const entity = world.spawn(...entityTraits);
-            entities.set(name, entity);
-        }
-        // Clean up non-active entities
-        for (const [name, entity] of entities) {
-            if (!frames[name]) {
-                entity?.destroy();
-                entities.delete(name);
+            // Clean up non-active entities
+            for (const [name, entity] of entities) {
+                if (!active[name]) {
+                    entity?.destroy();
+                    entities.delete(name);
+                    continue;
+                }
             }
-        }
+        });
     });
     setContext(key, {
         get current() {

package/dist/hooks/useGeometries.svelte.js

@@ -68,7 +68,7 @@ export const provideGeometries = (partID) => {
                         for (const geometry of query.data) {
                             index += 1;
                             const resourceName = resources.current[name];
-                            const label = geometry.label ? geometry.label : `${name} geometry ${index}`;
+                            const label = geometry.label || `${name} geometry ${index}`;
                             active[`${name}:${label}`] = true;
                             const pose = createPose(geometry.center);
                             const subtype = resourceName?.subtype;

package/dist/hooks/useLinked.svelte.js

@@ -18,11 +18,12 @@ export const provideLinkedEntities = () => {
             linkedEntities = linkedEntities.filter((e) => e !== target);
         }
     });
+    const unsub = () => {
+        unsubAdd();
+        unsubRemove();
+    };
     $effect(() => {
-        return () => {
-            unsubAdd();
-            unsubRemove();
-        };
+        return unsub;
     });
     setContext(linkedKey, {
         get current() {

package/dist/hooks/usePartConfig.svelte.js

@@ -79,16 +79,16 @@ export const providePartConfig = (partID, params) => {
         const existingFrameIndex = fragmentMod.mods.findLastIndex(
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         (mod) => mod?.['$set']?.[modSetPath] !== undefined);
-        if (existingFrameIndex !== -1) {
+        if (existingFrameIndex === -1) {
+            fragmentMod.mods.push(frame);
+        }
+        else {
             const existingGeometry = fragmentMod.mods[existingFrameIndex]['$set']?.[modSetPath].geometry;
             if (existingGeometry && !frameGeometry) {
                 frame['$set'][modSetPath].geometry = existingGeometry;
             }
             fragmentMod.mods[existingFrameIndex] = frame;
         }
-        else {
-            fragmentMod.mods.push(frame);
-        }
         config.set(newConfig);
     };
     const updatePartFrame = (componentName, referenceFrame, pose, geometry) => {
@@ -127,11 +127,10 @@ export const providePartConfig = (partID, params) => {
     const deletePartFrame = (componentName) => {
         const newConfig = getCurrent();
         const component = newConfig?.components?.find(({ name }) => name === componentName);
-        if (!component) {
-            return;
+        if (component) {
+            delete component.frame;
+            config.set(newConfig);
         }
-        delete component.frame;
-        config.set(newConfig);
     };
     const deleteFragmentFrame = (fragmentId, componentName) => {
         const newConfig = getCurrent();
@@ -168,29 +167,29 @@ export const providePartConfig = (partID, params) => {
         },
         updateFrame: (componentName, referenceFrame, framePosition, frameGeometry) => {
             const fragmentId = config.componentNameToFragmentId[componentName];
-            if (fragmentId !== undefined) {
-                updateFragmentFrame(fragmentId, componentName, referenceFrame, framePosition, frameGeometry);
+            if (fragmentId === undefined) {
+                updatePartFrame(componentName, referenceFrame, framePosition, frameGeometry);
             }
             else {
-                updatePartFrame(componentName, referenceFrame, framePosition, frameGeometry);
+                updateFragmentFrame(fragmentId, componentName, referenceFrame, framePosition, frameGeometry);
             }
         },
         deleteFrame: (componentName) => {
             const fragmentId = config.componentNameToFragmentId[componentName];
-            if (fragmentId !== undefined) {
-                deleteFragmentFrame(fragmentId, componentName);
+            if (fragmentId === undefined) {
+                deletePartFrame(componentName);
             }
             else {
-                deletePartFrame(componentName);
+                deleteFragmentFrame(fragmentId, componentName);
             }
         },
         createFrame: (componentName) => {
             const fragmentId = config.componentNameToFragmentId[componentName];
-            if (fragmentId !== undefined) {
-                createFragmentFrame(fragmentId, componentName);
+            if (fragmentId === undefined) {
+                createPartFrame(componentName);
             }
             else {
-                createPartFrame(componentName);
+                createFragmentFrame(fragmentId, componentName);
             }
         },
         save: () => config.save?.(),

package/dist/hooks/usePointcloudObjects.svelte.js

@@ -47,10 +47,10 @@ export const providePointcloudObjects = (partID) => {
      */
     $effect(() => {
         for (const [name, query] of propQueries) {
-            if (name && query.data?.objectPointCloudsSupported === false) {
-                if (disabledVisionServices.get(name) === undefined) {
-                    disabledVisionServices.set(name, true);
-                }
+            if (name &&
+                query.data?.objectPointCloudsSupported === false &&
+                disabledVisionServices.get(name) === undefined) {
+                disabledVisionServices.set(name, true);
             }
         }
     });

package/dist/hooks/usePointclouds.svelte.js

@@ -50,10 +50,8 @@ export const providePointclouds = (partID) => {
      */
     $effect(() => {
         for (const [name, query] of propQueries) {
-            if (name && query.data?.supportsPcd === false) {
-                if (disabledCameras.get(name) === undefined) {
-                    disabledCameras.set(name, true);
-                }
+            if (name && query.data?.supportsPcd === false && disabledCameras.get(name) === undefined) {
+                disabledCameras.set(name, true);
             }
         }
     });

package/dist/hooks/usePose.svelte.js

@@ -10,7 +10,7 @@ import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { useLogs } from './useLogs.svelte';
 import { useResourceByName } from './useResourceByName.svelte';
 import { useRefetchPoses } from './useRefetchPoses';
-const origingFrameComponentTypes = ['arm', 'gantry', 'gripper', 'base'];
+const originFrameComponentTypes = new Set(['arm', 'gantry', 'gripper', 'base']);
 export const usePose = (name, parent) => {
     const environment = useEnvironment();
     const logs = useLogs();
@@ -26,12 +26,8 @@ export const usePose = (name, parent) => {
     const frames = useFrames();
     let pose = $state();
     const interval = $derived(refreshRates.get(RefreshRates.poses));
-    const resolvedParent = $derived(origingFrameComponentTypes.includes(parentResource?.subtype ?? '')
-        ? `${parent()}_origin`
-        : parent());
-    const resolvedName = $derived(origingFrameComponentTypes.includes(resource?.subtype ?? '')
-        ? `${currentName}_origin`
-        : currentName);
+    const resolvedParent = $derived(originFrameComponentTypes.has(parentResource?.subtype ?? '') ? `${parent()}_origin` : parent());
+    const resolvedName = $derived(originFrameComponentTypes.has(resource?.subtype ?? '') ? `${currentName}_origin` : currentName);
     const query = createRobotQuery(robotClient, 'getPose', () => [resolvedName, resolvedParent ?? 'world', []], () => ({
         enabled: interval !== RefetchRates.OFF && environment.current.viewerMode === 'monitor',
         refetchInterval: interval === RefetchRates.MANUAL ? false : interval,

package/dist/hooks/useResizable.svelte.js

@@ -28,10 +28,11 @@ export const useResizable = (name, defaultDimensions) => {
         });
         observer.observe(target);
     };
+    const disconnect = () => {
+        observer?.disconnect();
+    };
     $effect(() => {
-        return () => {
-            observer?.disconnect();
-        };
+        return disconnect;
     });
     return {
         get current() {

package/dist/hooks/useSettings.svelte.js

@@ -30,11 +30,11 @@ const defaults = () => ({
     renderSubEntityHoverDetail: false,
     xrController: {
         left: {
-            scaleFactor: 1.0,
+            scaleFactor: 1,
             rotationEnabled: true,
         },
         right: {
-            scaleFactor: 1.0,
+            scaleFactor: 1,
             rotationEnabled: true,
         },
     },

package/dist/hooks/useWeblabs.svelte.js

@@ -17,6 +17,7 @@ const addCookie = (name, value, days, path = '/') => {
         date.setTime(date.getTime() + days * 24 * 60 * 60 * 1000); // days in milliseconds
         expires = '; expires=' + date.toUTCString();
     }
+    // eslint-disable-next-line unicorn/no-document-cookie
     document.cookie = `${encodeURIComponent(name)}=${encodeURIComponent(value)}${expires}; path=${path}`;
 };
 const getCookieExperiments = () => {
@@ -44,10 +45,10 @@ export const createWeblabs = () => {
     };
 };
 export const provideWeblabs = () => {
-    const urlExperiment = new URLSearchParams(window.location.search).get('experiment');
+    const urlExperiment = new URLSearchParams(globalThis.location.search).get('experiment');
     if (urlExperiment) {
         const experimentSet = new Set([...getCookieExperiments(), urlExperiment]);
-        addCookie('weblab_experiments', Array.from(experimentSet).join(','));
+        addCookie('weblab_experiments', [...experimentSet].join(','));
     }
     setContext(WEBLABS_CONTEXT_KEY, createWeblabs());
 };

package/dist/hooks/useWorldState.svelte.js

@@ -189,15 +189,17 @@ const createWorldState = (client) => {
                 continue;
             }
             switch (event.changeType) {
-                case TransformChangeType.REMOVED:
+                case TransformChangeType.REMOVED: {
                     eventsByUUID.set(uuid, event);
                     break;
-                case TransformChangeType.ADDED:
+                }
+                case TransformChangeType.ADDED: {
                     if (existing.changeType !== TransformChangeType.REMOVED) {
                         eventsByUUID.set(uuid, event);
                     }
                     break;
-                case TransformChangeType.UPDATED:
+                }
+                case TransformChangeType.UPDATED: {
                     // merge with existing updated event
                     if (existing.changeType === TransformChangeType.UPDATED) {
                         existing.updatedFields ??= { paths: [] };
@@ -214,6 +216,7 @@ const createWorldState = (client) => {
                         eventsByUUID.set(uuid, event);
                     }
                     break;
+                }
             }
         }
         pendingEvents.push(...eventsByUUID.values());

package/dist/loaders/pcd/index.js

@@ -22,6 +22,7 @@ export const parsePcdInWorker = (data) => {
     return new Promise((resolve, reject) => {
         const id = ++requestId;
         pending.set(id, { resolve, reject });
-        worker.postMessage({ id, data }, [data.buffer]);
+        const copy = new Uint8Array(data);
+        worker.postMessage({ id, data: copy }, [copy.buffer]);
     });
 };