@viamrobotics/motion-tools 1.13.1 → 1.15.0

package/dist/components/overlay/dashboard/Dashboard.svelte

@@ -1,6 +1,8 @@
 <script>
-	import { useSettings } from '../../../hooks/useSettings.svelte'
 	import { PortalTarget } from '@threlte/extras'
+
+	import { useSettings } from '../../../hooks/useSettings.svelte'
+
 	import Button from './Button.svelte'
 
 	let { dashboard, ...rest } = $props()

package/dist/components/overlay/left-pane/AddFrames.svelte

@@ -1,8 +1,10 @@
 <script lang="ts">
 	import { IconButton } from '@viamrobotics/prime-core'
-	import Drawer from './Drawer.svelte'
-	import { usePartConfig } from '../../../hooks/usePartConfig.svelte'
+
 	import { useFramelessComponents } from '../../../hooks/useFramelessComponents.svelte'
+	import { usePartConfig } from '../../../hooks/usePartConfig.svelte'
+
+	import Drawer from './Drawer.svelte'
 
 	const framelessComponents = useFramelessComponents()
 	const partConfig = usePartConfig()

package/dist/components/overlay/left-pane/Drawer.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
-	import { PersistedState } from 'runed'
-	import { Icon } from '@viamrobotics/prime-core'
 	import type { Snippet } from 'svelte'
 
+	import { Icon } from '@viamrobotics/prime-core'
+	import { PersistedState } from 'runed'
+
 	interface Props {
 		name: string
 		defaultOpen?: boolean

package/dist/components/overlay/left-pane/Tree.svelte

@@ -1,14 +1,15 @@
 <script lang="ts">
+	import { normalizeProps, useMachine } from '@zag-js/svelte'
 	import * as tree from '@zag-js/tree-view'
-	import { useMachine, normalizeProps } from '@zag-js/svelte'
 	import { ChevronRight, Eye, EyeOff } from 'lucide-svelte'
-	import { useVisibility } from '../../../hooks/useVisibility.svelte'
-	import type { TreeNode } from './buildTree'
 	import { VirtualList } from 'svelte-virtuallists'
-	import { Icon } from '@viamrobotics/prime-core'
+	import { SvelteSet } from 'svelte/reactivity'
+
 	import { traits } from '../../../ecs'
 	import { useSelectedEntity } from '../../../hooks/useSelection.svelte'
-	import { SvelteSet } from 'svelte/reactivity'
+	import { useVisibility } from '../../../hooks/useVisibility.svelte'
+
+	import type { TreeNode } from './buildTree'
 
 	const selected = useSelectedEntity()
 	const visibility = useVisibility()
@@ -177,13 +178,6 @@
 
 <div class="root-node">
 	<div {...api.getRootProps() as object}>
-		<div class="border-medium flex items-center gap-1 border-b p-2">
-			<button bind:this={dragElement}>
-				<Icon name="drag" />
-			</button>
-			<h3 {...api.getLabelProps() as object}>{rootNode.entity.get(traits.Name)}</h3>
-		</div>
-
 		<div {...api.getTreeProps()}>
 			{#if rootChildren.length === 0}
 				<p class="text-subtle-2 px-2 py-4">No objects displayed</p>

package/dist/components/overlay/left-pane/TreeContainer.svelte

@@ -1,31 +1,24 @@
 <script lang="ts">
-	import { draggable } from '@neodrag/svelte'
-	import Tree from './Tree.svelte'
-	import { useSelectedEntity } from '../../../hooks/useSelection.svelte'
-	import { provideTreeExpandedContext } from './useExpanded.svelte'
-	import AddFrames from './AddFrames.svelte'
+	import { type Entity, IsExcluded } from 'koota'
+
+	import { traits, useQuery, useWorld } from '../../../ecs'
 	import { useEnvironment } from '../../../hooks/useEnvironment.svelte'
-	import { usePartID } from '../../../hooks/usePartID.svelte'
-	import { usePartConfig } from '../../../hooks/usePartConfig.svelte'
 	import { useFrames } from '../../../hooks/useFrames.svelte'
-	import { traits, useQuery, useWorld } from '../../../ecs'
-	import { IsExcluded, type Entity } from 'koota'
-	import { buildTreeNodes, type TreeNode } from './buildTree'
-	import { MIN_DIMENSIONS, useResizable } from '../../../hooks/useResizable.svelte'
+	import { usePartConfig } from '../../../hooks/usePartConfig.svelte'
+	import { usePartID } from '../../../hooks/usePartID.svelte'
+	import { useSelectedEntity } from '../../../hooks/useSelection.svelte'
 
-	const { ...rest } = $props()
+	import FloatingPanel from '../FloatingPanel.svelte'
+	import AddFrames from './AddFrames.svelte'
+	import { buildTreeNodes, type TreeNode } from './buildTree'
+	import Tree from './Tree.svelte'
+	import { provideTreeExpandedContext } from './useExpanded.svelte'
 
 	provideTreeExpandedContext()
 
-	let container = $state.raw<HTMLDivElement>()
-	let dragElement = $state.raw<HTMLElement>()
-
 	const partID = usePartID()
 	const selectedEntity = useSelectedEntity()
-	const resizable = useResizable(
-		() => 'treeview',
-		() => ({ width: 240, height: window.innerHeight - 20 })
-	)
+
 	const environment = useEnvironment()
 	const partConfig = usePartConfig()
 	const frames = useFrames()
@@ -46,39 +39,29 @@
 		entity: worldEntity,
 		children: rootNodes,
 	})
-
-	$effect(() => {
-		if (container) {
-			resizable.observe(container)
-		}
-	})
 </script>
 
-<div
-	bind:this={container}
-	class="bg-extralight border-medium absolute top-0 left-0 z-4 m-2 resize overflow-y-auto border text-xs"
-	style:min-width="{MIN_DIMENSIONS.width}px"
-	style:min-height="{MIN_DIMENSIONS.height}px"
-	style:width={resizable.current ? `${resizable.current.width}px` : undefined}
-	style:height={resizable.current ? `${resizable.current.height}px` : undefined}
-	use:draggable={{
-		bounds: 'body',
-		handle: dragElement,
-	}}
-	{...rest}
+<FloatingPanel
+	isOpen
+	defaultPosition={{ x: 10, y: 10 }}
+	defaultSize={{ width: 240, height: 400 }}
+	title="World"
+	exitable={false}
+	resizable
 >
-	<Tree
-		{rootNode}
-		{nodeMap}
-		bind:dragElement
-		onSelectionChange={(event) => {
-			const value = event.selectedValue[0]
+	<div class="text-xs">
+		<Tree
+			{rootNode}
+			{nodeMap}
+			onSelectionChange={(event) => {
+				const value = event.selectedValue[0]
 
-			selectedEntity.set(value ? (Number(value) as Entity) : undefined)
-		}}
-	/>
+				selectedEntity.set(value ? (Number(value) as Entity) : undefined)
+			}}
+		/>
 
-	{#if environment.current.isStandalone && partID.current && partConfig.hasEditPermissions}
-		<AddFrames />
-	{/if}
-</div>
+		{#if environment.current.isStandalone && partID.current && partConfig.hasEditPermissions}
+			<AddFrames />
+		{/if}
+	</div>
+</FloatingPanel>

package/dist/components/overlay/left-pane/TreeContainer.svelte.d.ts

@@ -1,3 +1,3 @@
-declare const TreeContainer: import("svelte").Component<Record<string, any>, {}, "">;
+declare const TreeContainer: import("svelte").Component<Record<string, never>, {}, "">;
 type TreeContainer = ReturnType<typeof TreeContainer>;
 export default TreeContainer;

package/dist/components/overlay/left-pane/buildTree.js

@@ -1,4 +1,7 @@
 import { traits } from '../../../ecs';
+function sortNodes(nodes) {
+    nodes.sort((a, b) => a.entity.get(traits.Name)?.localeCompare(b.entity.get(traits.Name) ?? '') ?? 0);
+}
 /**
  * Creates a tree representing parent child / relationships from a set of frames.
  */
@@ -29,5 +32,17 @@ export const buildTreeNodes = (entities) => {
             }
         }
     }
+    for (const node of rootNodes) {
+        if (!node.children)
+            continue;
+        sortNodes(node.children);
+    }
+    for (const node of childNodes) {
+        if (!node.children)
+            continue;
+        sortNodes(node.children);
+    }
+    sortNodes(rootNodes);
+    sortNodes(childNodes);
     return { rootNodes, nodeMap };
 };

package/dist/components/overlay/settings/Settings.svelte

@@ -1,21 +1,25 @@
 <script lang="ts">
-	import { Switch, Input } from '@viamrobotics/prime-core'
+	import { useThrelte } from '@threlte/core'
 	import { Portal } from '@threlte/extras'
-	import RefreshRate from '../RefreshRate.svelte'
-	import { useSettings } from '../../../hooks/useSettings.svelte'
+	import { Input, Switch } from '@viamrobotics/prime-core'
 	import { useResourceNames } from '@viamrobotics/svelte-sdk'
-	import { usePartID } from '../../../hooks/usePartID.svelte'
-	import { RefreshRates, useMachineSettings } from '../../../hooks/useMachineSettings.svelte'
+	import { PersistedState } from 'runed'
+	import { onMount } from 'svelte'
+
+	import DashboardButton from '../dashboard/Button.svelte'
+	import XRControllerSettings from '../../xr/XRControllerSettings.svelte'
 	import { useGeometries } from '../../../hooks/useGeometries.svelte'
+	import { RefreshRates, useMachineSettings } from '../../../hooks/useMachineSettings.svelte'
+	import { usePartID } from '../../../hooks/usePartID.svelte'
 	import { usePointClouds } from '../../../hooks/usePointclouds.svelte'
-	import { useThrelte } from '@threlte/core'
 	import { useRefetchPoses } from '../../../hooks/useRefetchPoses'
+	import { useSettings } from '../../../hooks/useSettings.svelte'
+	import { useWeblabs, WEBLABS_EXPERIMENTS } from '../../../hooks/useWeblabs.svelte'
+
 	import FloatingPanel from '../FloatingPanel.svelte'
-	import DashboardButton from '../dashboard/Button.svelte'
-	import Tabs from './Tabs.svelte'
-	import { PersistedState } from 'runed'
+	import RefreshRate from '../RefreshRate.svelte'
 	import ToggleGroup from '../ToggleGroup.svelte'
-	import XRControllerSettings from '../../xr/XRControllerSettings.svelte'
+	import Tabs from './Tabs.svelte'
 
 	const { invalidate } = useThrelte()
 	const partID = usePartID()
@@ -26,6 +30,12 @@
 	const geometries = useGeometries()
 	const pointclouds = usePointClouds()
 	const { refetchPoses } = useRefetchPoses()
+	const weblabs = useWeblabs()
+	const knownWeblabs = Object.keys(WEBLABS_EXPERIMENTS)
+
+	onMount(() => {
+		weblabs.load(knownWeblabs)
+	})
 
 	// Invalidate the renderer for any settings change
 	$effect(() => {
@@ -269,6 +279,22 @@
 	</div>
 {/snippet}
 
+{#snippet Weblabs()}
+	<div class="flex flex-col gap-1 text-xs">
+		{#each knownWeblabs as experiment (experiment)}
+			<label class="flex items-center justify-between gap-2 py-0.5">
+				{experiment}
+				<Switch
+					on={weblabs.isActive(experiment)}
+					on:change={() => weblabs.toggle(experiment)}
+				/>
+			</label>
+		{:else}
+			No weblabs defined
+		{/each}
+	</div>
+{/snippet}
+
 {#snippet Widgets()}
 	<div class="text-gray-9 flex flex-col gap-1 text-xs">
 		<label class="flex items-center justify-between gap-2 py-1">
@@ -319,6 +345,7 @@
 			{ label: 'Vision', content: Vision },
 			{ label: 'Widgets', content: Widgets },
 			{ label: 'Stats', content: Stats },
+			{ label: 'Weblabs', content: Weblabs },
 			...('xr' in navigator ? [{ label: 'VR / AR', content: XR }] : []),
 		]}
 		onValueChange={(value) => {

package/dist/components/overlay/settings/Tabs.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
 	import type { Snippet } from 'svelte'
+
+	import { normalizeProps, useMachine } from '@zag-js/svelte'
 	import * as tabs from '@zag-js/tabs'
-	import { useMachine, normalizeProps } from '@zag-js/svelte'
 
 	interface Props {
 		defaultTab?: string

package/dist/components/overlay/widgets/ArmPositions.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
 	import { draggable } from '@neodrag/svelte'
-	import { formatNumeric } from '../../../format'
+	import { Icon, Label, Select } from '@viamrobotics/prime-core'
+
 	import Table from '../Table.svelte'
+	import { formatNumeric } from '../../../format'
 	import { useArmClient } from '../../../hooks/useArmClient.svelte'
-	import { Icon, Label, Select } from '@viamrobotics/prime-core'
 
 	const { ...rest } = $props()
 

package/dist/components/overlay/widgets/Camera.svelte

@@ -1,11 +1,12 @@
 <script lang="ts">
 	import { draggable } from '@neodrag/svelte'
 	import { Icon, Select } from '@viamrobotics/prime-core'
-	import { CameraStream, useRobotClient, useConnectionStatus } from '@viamrobotics/svelte-sdk'
-	import { StreamClient, MachineConnectionEvent } from '@viamrobotics/sdk'
-	import { useSettings } from '../../../hooks/useSettings.svelte'
-	import { usePartID } from '../../../hooks/usePartID.svelte'
+	import { MachineConnectionEvent, StreamClient } from '@viamrobotics/sdk'
+	import { CameraStream, useConnectionStatus, useRobotClient } from '@viamrobotics/svelte-sdk'
+
 	import { useEnvironment } from '../../../hooks/useEnvironment.svelte'
+	import { usePartID } from '../../../hooks/usePartID.svelte'
+	import { useSettings } from '../../../hooks/useSettings.svelte'
 
 	interface Resolution {
 		width: number
@@ -115,7 +116,7 @@
 </script>
 
 <div
-	class="bg-extralight border-medium absolute top-0 left-0 z-4 m-2 flex resize-x flex-col overflow-hidden border text-xs"
+	class="bg-extralight border-medium absolute top-0 left-0 z-4 m-2 flex resize-x flex-col overflow-hidden border text-xs dark:text-black"
 	style:width="320px"
 	style:height="auto !important"
 	use:draggable={{

package/dist/components/weblab/WeblabActive.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
-	import { useWeblabs } from '../../hooks/useWeblabs.svelte'
 	import type { Snippet } from 'svelte'
 
+	import { useWeblabs } from '../../hooks/useWeblabs.svelte'
+
 	interface Props {
 		experiment: string
 		renderIfActive?: boolean

package/dist/components/xr/ArmTeleop.svelte

@@ -1,17 +1,18 @@
 <script lang="ts">
-	import { useTask, T } from '@threlte/core'
+	import { T, useTask } from '@threlte/core'
 	import { useController, useXR, type XRController } from '@threlte/xr'
-	import { Vector3, Quaternion } from 'three'
-	import { createResourceClient } from '@viamrobotics/svelte-sdk'
 	import { ArmClient, GripperClient } from '@viamrobotics/sdk'
 	import * as VIAM from '@viamrobotics/sdk'
-	import { usePartID } from '../../hooks/usePartID.svelte'
+	import { createResourceClient } from '@viamrobotics/svelte-sdk'
+	import { Quaternion, Vector3 } from 'three'
+
 	import {
-		getFrameTransformationQuaternion,
 		calculatePositionTarget,
+		getFrameTransformationQuaternion,
 	} from './math'
-	import { OrientationVector } from '../../three/OrientationVector'
 	import { xrToast } from './toasts.svelte'
+	import { usePartID } from '../../hooks/usePartID.svelte'
+	import { OrientationVector } from '../../three/OrientationVector'
 
 	interface Props {
 		armName: string

package/dist/components/xr/BentPlaneGeometry.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
-	import { Vector2, PlaneGeometry } from 'three'
-	import { T } from '@threlte/core'
 	import type { BufferAttribute } from 'three'
 
+	import { T } from '@threlte/core'
+	import { PlaneGeometry, Vector2 } from 'three'
+
 	export let args: [
 		radius: number,
 		width?: number | undefined,

package/dist/components/xr/CameraFeed.svelte

@@ -2,7 +2,9 @@
 	import { T, useTask } from '@threlte/core'
 	import { createStreamClient } from '@viamrobotics/svelte-sdk'
 	import { VideoTexture } from 'three'
+
 	import { usePartID } from '../../hooks/usePartID.svelte'
+
 	import BentPlaneGeometry from './BentPlaneGeometry.svelte'
 
 	interface CameraFeedProps {

package/dist/components/xr/Controllers.svelte

@@ -1,10 +1,12 @@
 <script lang="ts">
-	import { Controller } from '@threlte/xr'
 	import { RigidBody } from '@threlte/rapier'
-	import HandCollider from './HandCollider.svelte'
-	import ArmTeleop from './ArmTeleop.svelte'
+	import { Controller } from '@threlte/xr'
+
 	import { useSettings } from '../../hooks/useSettings.svelte'
 
+	import ArmTeleop from './ArmTeleop.svelte'
+	import HandCollider from './HandCollider.svelte'
+
 	const settings = useSettings()
 
 	// Get controller config from settings

package/dist/components/xr/Draggable.svelte

@@ -1,11 +1,12 @@
 <script lang="ts">
+	import type { Snippet } from 'svelte'
+
+	import { RigidBody as RigidBodyType } from '@dimforge/rapier3d-compat'
 	import { T, useTask } from '@threlte/core'
 	import { useGamepad } from '@threlte/extras'
+	import { AutoColliders, RigidBody } from '@threlte/rapier'
 	import { useController } from '@threlte/xr'
-	import { RigidBody as RigidBodyType } from '@dimforge/rapier3d-compat'
-	import type { Snippet } from 'svelte'
 	import { Group, Vector3 } from 'three'
-	import { AutoColliders, RigidBody } from '@threlte/rapier'
 
 	interface Props {
 		children: Snippet

package/dist/components/xr/HandCollider.svelte

@@ -1,7 +1,8 @@
 <script lang="ts">
+	import type { Group } from 'three'
+
 	import { useParent, useTask } from '@threlte/core'
 	import { Collider, useRigidBody } from '@threlte/rapier'
-	import type { Group } from 'three'
 
 	const parent = useParent()
 	const rb = useRigidBody()

package/dist/components/xr/JointLimitsWidget.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { T } from '@threlte/core'
 	import { CanvasTexture, PlaneGeometry } from 'three'
+
 	import { useArmClient } from '../../hooks/useArmClient.svelte'
 	import { useArmKinematics } from '../../hooks/useArmKinematics.svelte'
 

package/dist/components/xr/OriginMarker.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
+	import { RigidBody as RigidBodyType } from '@dimforge/rapier3d-compat'
 	import { T, useTask } from '@threlte/core'
 	import { Grid, useGamepad } from '@threlte/extras'
 	import { Collider, RigidBody } from '@threlte/rapier'
-	import { RigidBody as RigidBodyType } from '@dimforge/rapier3d-compat'
 	import { useController } from '@threlte/xr'
 	import { Euler, Group, Quaternion, Vector3 } from 'three'
+
 	import { useOrigin } from './useOrigin.svelte'
 
 	const origin = useOrigin()

package/dist/components/xr/PointDistance.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
 	import { T, useTask } from '@threlte/core'
-	import Draggable from './Draggable.svelte'
+	import { Billboard, Text } from '@threlte/extras'
 	import { Mesh, Vector3 } from 'three'
-	import { Text, Billboard } from '@threlte/extras'
+
+	import Draggable from './Draggable.svelte'
 
 	const mesh1 = new Mesh()
 	const mesh2 = new Mesh()

package/dist/components/xr/XR.svelte

@@ -1,16 +1,18 @@
 <script lang="ts">
 	import { T } from '@threlte/core'
-	import { useXR, XR, XRButton } from '@threlte/xr'
 	import { World } from '@threlte/rapier'
-	import OriginMarker from './OriginMarker.svelte'
+	import { useXR, XR, XRButton } from '@threlte/xr'
+	import { SvelteMap } from 'svelte/reactivity'
+
+	import { usePartID } from '../../hooks/usePartID.svelte'
 	import { useSettings } from '../../hooks/useSettings.svelte'
-	import Controllers from './Controllers.svelte'
+
 	import CameraFeed from './CameraFeed.svelte'
+	import Controllers from './Controllers.svelte'
 	import JointLimitsWidget from './JointLimitsWidget.svelte'
-	import { usePartID } from '../../hooks/usePartID.svelte'
-	import XRToast from './XRToast.svelte'
+	import OriginMarker from './OriginMarker.svelte'
 	import { useOrigin } from './useOrigin.svelte'
-	import { SvelteMap } from 'svelte/reactivity'
+	import XRToast from './XRToast.svelte'
 
 	const { ...rest } = $props()
 

package/dist/components/xr/XRConfigPanel.svelte

@@ -1,11 +1,12 @@
 <script lang="ts">
 	import { T, useTask } from '@threlte/core'
-	import { CanvasTexture, PlaneGeometry, Mesh, Raycaster } from 'three'
+	import { useController, type XRController } from '@threlte/xr'
+	import { useResourceNames } from '@viamrobotics/svelte-sdk'
+	import { CanvasTexture, Mesh, PlaneGeometry, Raycaster } from 'three'
+
 	import { useArmClient } from '../../hooks/useArmClient.svelte'
 	import { usePartID } from '../../hooks/usePartID.svelte'
-	import { useResourceNames } from '@viamrobotics/svelte-sdk'
 	import { useSettings } from '../../hooks/useSettings.svelte'
-	import { useController, type XRController } from '@threlte/xr'
 
 	interface XRConfigPanelProps {
 		offset?: { x?: number; y?: number; z?: number }

package/dist/components/xr/XRControllerSettings.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
 	import { Select, Switch } from '@viamrobotics/prime-core'
+	import { useResourceNames } from '@viamrobotics/svelte-sdk'
+
 	import { useArmClient } from '../../hooks/useArmClient.svelte'
 	import { usePartID } from '../../hooks/usePartID.svelte'
-	import { useResourceNames } from '@viamrobotics/svelte-sdk'
 	import { useSettings } from '../../hooks/useSettings.svelte'
 
 	const settings = useSettings()

package/dist/components/xr/XRToast.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
-	import { untrack } from 'svelte'
 	import { T } from '@threlte/core'
-	import { CanvasTexture, PlaneGeometry } from 'three'
-	import { xrToast, type XRToastItem, type ToastVariant } from './toasts.svelte'
 	import { Headset } from '@threlte/xr'
+	import { untrack } from 'svelte'
+	import { CanvasTexture, PlaneGeometry } from 'three'
+
+	import { type ToastVariant, xrToast, type XRToastItem } from './toasts.svelte'
 
 	const CANVAS_WIDTH = 700
 	const TOAST_HEIGHT = 80

package/dist/ecs/traits.d.ts

@@ -1,6 +1,7 @@
 import type { GLTF as ThreeGltf } from 'three/examples/jsm/loaders/GLTFLoader.js';
-import { BufferGeometry as ThreeBufferGeometry } from 'three';
 import { Geometry as ViamGeometry } from '@viamrobotics/sdk';
+import { type Entity } from 'koota';
+import { BufferGeometry as ThreeBufferGeometry } from 'three';
 export declare const Name: import("koota").Trait<() => string>;
 export declare const Parent: import("koota").Trait<() => string>;
 export declare const Pose: import("koota").Trait<{
@@ -178,22 +179,4 @@ export declare const Geometry: (geometry: ViamGeometry) => import("koota").Trait
 }>, Partial<{
     r: number;
 }>] | [import("koota").Trait<() => ThreeBufferGeometry<import("three").NormalBufferAttributes, import("three").BufferGeometryEventMap>>, ThreeBufferGeometry<import("three").NormalBufferAttributes, import("three").BufferGeometryEventMap>];
-export declare const updateGeometry: (geometry: ViamGeometry) => (ThreeBufferGeometry<import("three").NormalBufferAttributes, import("three").BufferGeometryEventMap> | import("koota").Trait<() => ThreeBufferGeometry<import("three").NormalBufferAttributes, import("three").BufferGeometryEventMap>>)[] | ({
-    x: number;
-    y: number;
-    z: number;
-} | import("koota").Trait<{
-    x: number;
-    y: number;
-    z: number;
-}>)[] | ({
-    r: number;
-    l: number;
-} | import("koota").Trait<{
-    l: number;
-    r: number;
-}>)[] | ({
-    r: number;
-} | import("koota").Trait<{
-    r: number;
-}>)[];
+export declare const updateGeometryTrait: (entity: Entity, geometry?: ViamGeometry) => void;

package/dist/ecs/traits.js

@@ -1,6 +1,6 @@
+import { Geometry as ViamGeometry } from '@viamrobotics/sdk';
 import { trait } from 'koota';
 import { BufferGeometry as ThreeBufferGeometry } from 'three';
-import { Geometry as ViamGeometry } from '@viamrobotics/sdk';
 import { createBox, createCapsule, createSphere } from '../geometry';
 import { parsePlyInput } from '../ply';
 export const Name = trait(() => '');
@@ -126,18 +126,45 @@ export const Geometry = (geometry) => {
     }
     return ReferenceFrame;
 };
-export const updateGeometry = (geometry) => {
+export const updateGeometryTrait = (entity, geometry) => {
+    if (!geometry) {
+        entity.remove(Box, Capsule, Sphere, BufferGeometry);
+        return;
+    }
     if (geometry.geometryType.case === 'box') {
-        return [Box, createBox(geometry.geometryType.value)];
+        if (entity.has(Box)) {
+            entity.set(Box, createBox(geometry.geometryType.value));
+        }
+        else {
+            entity.remove(Capsule, Sphere, BufferGeometry);
+            entity.add(Box(createBox(geometry.geometryType.value)));
+        }
     }
     else if (geometry.geometryType.case === 'capsule') {
-        return [Capsule, createCapsule(geometry.geometryType.value)];
+        if (entity.has(Capsule)) {
+            entity.set(Capsule, createCapsule(geometry.geometryType.value));
+        }
+        else {
+            entity.remove(Box, Sphere, BufferGeometry);
+            entity.add(Capsule(createCapsule(geometry.geometryType.value)));
+        }
     }
     else if (geometry.geometryType.case === 'sphere') {
-        return [Sphere, createSphere(geometry.geometryType.value)];
+        if (entity.has(Sphere)) {
+            entity.set(Sphere, createSphere(geometry.geometryType.value));
+        }
+        else {
+            entity.remove(Box, Capsule, BufferGeometry);
+            entity.add(Sphere(createSphere(geometry.geometryType.value)));
+        }
     }
     else if (geometry.geometryType.case === 'mesh') {
-        return [BufferGeometry, parsePlyInput(geometry.geometryType.value.mesh)];
+        if (entity.has(BufferGeometry)) {
+            entity.set(BufferGeometry, parsePlyInput(geometry.geometryType.value.mesh));
+        }
+        else {
+            entity.remove(Box, Sphere, Capsule);
+            entity.add(BufferGeometry(parsePlyInput(geometry.geometryType.value.mesh)));
+        }
     }
-    return [];
 };