@viamrobotics/motion-tools 0.18.1 → 0.18.2

package/dist/components/Frame.svelte

@@ -8,8 +8,12 @@
 	import { useObjectEvents } from '../hooks/useObjectEvents.svelte'
 	import { Color, type Object3D } from 'three'
 	import Geometry from './Geometry.svelte'
+	import { useWeblabs } from '../hooks/useWeblabs.svelte'
 	import { useSelected } from '../hooks/useSelection.svelte'
+	import { useSettings } from '../hooks/useSettings.svelte'
+	import { use3DModels } from '../hooks/use3DModels.svelte'
 	import { colors, darkenColor } from '../color'
+	import { WEBLABS_EXPERIMENTS } from '../hooks/useWeblabs.svelte'
 
 	interface Props {
 		uuid: string
@@ -20,16 +24,34 @@
 		children?: Snippet<[{ ref: Object3D }]>
 	}
 
-	let { uuid, ...rest }: Props = $props()
+	let { uuid, name, ...rest }: Props = $props()
 
+	const settings = useSettings()
+	const componentModels = use3DModels()
 	const selected = useSelected()
+	const weblabs = useWeblabs()
 	const events = useObjectEvents(() => uuid)
 
 	const color = $derived(rest.metadata.color ?? colors.default)
+
+	const model = $derived.by(() => {
+		if (!weblabs.isActive(WEBLABS_EXPERIMENTS.MOTION_TOOLS_RENDER_ARM_MODELS)) {
+			return
+		}
+
+		const [componentName, id] = name.split(':')
+		if (!componentName || !id) {
+			return
+		}
+		return componentModels.current?.[componentName]?.[id]
+	})
 </script>
 
 <Geometry
 	{uuid}
+	{name}
+	{model}
+	renderMode={settings.current.renderArmModels}
 	color={selected.current === uuid
 		? `#${darkenColor(color, 75).getHexString()}`
 		: `#${colorUtil.set(color).getHexString()}`}

package/dist/components/Geometry.svelte

@@ -1,3 +1,9 @@
+<!--
+
+This component is consumed as a library export
+and should remain pure, i.e. no hooks should be used.
+
+-->
 <script lang="ts">
 	import { T, type Props as ThrelteProps } from '@threlte/core'
 	import { type Snippet } from 'svelte'
@@ -10,14 +16,7 @@
 	import type { WorldObject } from '../WorldObject.svelte'
 	import { PLYLoader } from 'three/addons/loaders/PLYLoader.js'
 
-	import { WEBLABS_EXPERIMENTS } from '../hooks/useWeblabs.svelte'
-	import { useSettings } from '../hooks/useSettings.svelte'
-	import { useWeblabs } from '../hooks/useWeblabs.svelte'
-	import { use3DModels } from '../hooks/use3DModels.svelte'
-	const settings = useSettings()
 	const plyLoader = new PLYLoader()
-	const weblabs = useWeblabs()
-	const componentModels = use3DModels()
 
 	interface Props extends ThrelteProps<Group> {
 		uuid: string
@@ -25,8 +24,10 @@
 		geometry?: WorldObject['geometry']
 		pose: WorldObject['pose']
 		metadata: WorldObject['metadata']
-		children?: Snippet<[{ ref: Group }]>
 		color?: string
+		model?: Group
+		renderMode?: 'model' | 'colliders' | 'colliders+model'
+		children?: Snippet<[{ ref: Group }]>
 	}
 
 	let {
@@ -36,32 +37,15 @@
 		metadata,
 		pose,
 		color: overrideColor,
+		model,
+		renderMode = 'colliders',
 		children,
 		...rest
 	}: Props = $props()
 
-	const gltfModel = $derived.by(() => {
-		const [componentName, id] = name.split(':')
-		if (!componentName || !id) {
-			return undefined
-		}
-		return componentModels.current?.[componentName]?.[id]
-	})
-
 	const type = $derived(geometry?.geometryType?.case)
 	const color = $derived(overrideColor ?? metadata.color ?? colors.default)
 
-	const renderModels = $derived(
-		(settings.current.renderArmModels === 'model' ||
-			settings.current.renderArmModels === 'colliders+model') &&
-			gltfModel
-	)
-	const renderPrimitives = $derived(
-		settings.current.renderArmModels === 'colliders' ||
-			settings.current.renderArmModels === 'colliders+model' ||
-			!gltfModel
-	)
-
 	const group = new Group()
 	const mesh = $derived.by(() => {
 		if (type === undefined) {
@@ -76,16 +60,6 @@
 		return result
 	})
 
-	$effect.pre(() => {
-		if (
-			weblabs.isActive(WEBLABS_EXPERIMENTS.MOTION_TOOLS_RENDER_ARM_MODELS) &&
-			renderModels &&
-			!renderPrimitives
-		) {
-			geo = undefined
-		}
-	})
-
 	$effect.pre(() => {
 		if (geometry?.center && mesh) {
 			poseToObject3d(geometry.center, mesh)
@@ -139,11 +113,11 @@
 			{uuid}
 			bvh={{ enabled: false }}
 		>
-			{#if weblabs.isActive(WEBLABS_EXPERIMENTS.MOTION_TOOLS_RENDER_ARM_MODELS) && renderModels}
-				<T is={gltfModel} />
+			{#if model && renderMode.includes('model')}
+				<T is={model} />
 			{/if}
 
-			{#if !weblabs.isActive(WEBLABS_EXPERIMENTS.MOTION_TOOLS_RENDER_ARM_MODELS) || renderPrimitives}
+			{#if renderMode.includes('colliders')}
 				{#if geometry.geometryType.case === 'bufferGeometry'}
 					<T
 						is={geometry.geometryType.value}
@@ -193,7 +167,7 @@
 					opacity={metadata.opacity ?? 0.7}
 				/>
 
-				{#if geo}
+				{#if geo && renderMode.includes('colliders')}
 					<T.LineSegments
 						raycast={() => null}
 						bvh={{ enabled: false }}

package/dist/components/Geometry.svelte.d.ts

@@ -8,10 +8,12 @@ interface Props extends ThrelteProps<Group> {
     geometry?: WorldObject['geometry'];
     pose: WorldObject['pose'];
     metadata: WorldObject['metadata'];
+    color?: string;
+    model?: Group;
+    renderMode?: 'model' | 'colliders' | 'colliders+model';
     children?: Snippet<[{
         ref: Group;
     }]>;
-    color?: string;
 }
 declare const Geometry: import("svelte").Component<Props, {}, "">;
 type Geometry = ReturnType<typeof Geometry>;

package/package.json

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