@viamrobotics/motion-tools 1.26.1 → 1.27.0

package/dist/components/SelectedTransformControls.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { TransformControls } from '@threlte/extras'
-	import { Quaternion, Vector3 } from 'three'
+	import { Matrix4, Quaternion, Vector3 } from 'three'
 
 	import type { FrameEditSession } from '../editing/FrameEditSession'
 
@@ -11,9 +11,11 @@
 	import { useSelectedEntity, useSelectedObject3d } from '../hooks/useSelection.svelte'
 	import { useSettings } from '../hooks/useSettings.svelte'
 	import {
-		composeEditedPoseForRenderedPose,
 		createPose,
+		matrixToPose,
+		poseToMatrix,
 		quaternionToPose,
+		solveEditedMatrix,
 		vector3ToPose,
 	} from '../transform'
 
@@ -27,8 +29,8 @@
 	const mode = $derived(settings.current.transformMode)
 	const entity = $derived(selectedEntity.current)
 	const transformable = useTrait(() => entity, traits.Transformable)
-	const networkPose = useTrait(() => entity, traits.Pose)
-	const livePose = useTrait(() => entity, traits.LivePose)
+	const configMatrix = useTrait(() => entity, traits.Matrix)
+	const liveMatrix = useTrait(() => entity, traits.LiveMatrix)
 	const box = useTrait(() => entity, traits.Box)
 	const sphere = useTrait(() => entity, traits.Sphere)
 	const capsule = useTrait(() => entity, traits.Capsule)
@@ -42,10 +44,12 @@
 	// the geometry inside it.
 	const ref = $derived(selectedObject3d.current?.parent ?? selectedObject3d.current)
 
-	const activeMode = $derived.by(() => {
-		if (mode === 'none' || !transformable.current) return undefined
+	const activeMode = $derived.by<'translate' | 'rotate' | 'scale' | undefined>(() => {
+		if (mode === 'none' || !transformable.current) return
+
 		// Scale only does anything for primitive geometries the gizmo can size.
-		if (mode === 'scale' && !hasScalableGeometry) return undefined
+		if (mode === 'scale' && !hasScalableGeometry) return
+
 		return mode
 	})
 	const isSphereScale = $derived(activeMode === 'scale' && sphere.current !== undefined)
@@ -54,6 +58,9 @@
 	const quaternion = new Quaternion()
 	const vector3 = new Vector3()
 	const refPose = createPose()
+	const tempRefMatrix = new Matrix4()
+	const tempEditedMatrix = new Matrix4()
+	const tempPose = createPose()
 
 	let session: FrameEditSession | undefined
 	let scaleStart:
@@ -93,7 +100,9 @@
 		if (entity?.has(traits.FramesAPI)) {
 			session = sessions.begin([entity])
 		}
+
 		captureScaleStart()
+
 		environment.current.viewerMode = 'edit'
 		transformControls.setActive(true)
 	}
@@ -109,15 +118,17 @@
 			if (isFrameEntity) {
 				stageFrameTransform()
 			} else {
-				const pose = entity.get(traits.Pose)
-				if (pose) {
+				const matrix = entity.get(traits.Matrix)
+				if (matrix) {
+					matrixToPose(matrix, tempPose)
 					if (activeMode === 'translate') {
-						vector3ToPose(ref.getWorldPosition(vector3), pose)
+						vector3ToPose(ref.getWorldPosition(vector3), tempPose)
 					} else {
-						quaternionToPose(ref.getWorldQuaternion(quaternion), pose)
+						quaternionToPose(ref.getWorldQuaternion(quaternion), tempPose)
 						ref.quaternion.copy(quaternion)
 					}
-					entity.set(traits.Pose, pose)
+					poseToMatrix(tempPose, matrix)
+					entity.changed(traits.Matrix)
 				}
 			}
 		} else {
@@ -127,11 +138,14 @@
 				captureScaleStart()
 			}
 
+			// Clamp at 0 — the gizmo can produce negative scale factors when
+			// dragged past the origin, which would yield negative dimensions
+			// and a degenerate OBB.
 			if (scaleStart?.type === 'box') {
 				const next = {
-					x: scaleStart.x * ref.scale.x,
-					y: scaleStart.y * ref.scale.y,
-					z: scaleStart.z * ref.scale.z,
+					x: Math.max(0, scaleStart.x * ref.scale.x),
+					y: Math.max(0, scaleStart.y * ref.scale.y),
+					z: Math.max(0, scaleStart.z * ref.scale.z),
 				}
 				if (isFrameEntity) {
 					session?.stageGeometry(entity, { type: 'box', ...next })
@@ -139,14 +153,17 @@
 					entity.set(traits.Box, next)
 				}
 			} else if (scaleStart?.type === 'sphere') {
-				const next = { r: scaleStart.r * ref.scale.x }
+				const next = { r: Math.max(0, scaleStart.r * ref.scale.x) }
 				if (isFrameEntity) {
 					session?.stageGeometry(entity, { type: 'sphere', ...next })
 				} else {
 					entity.set(traits.Sphere, next)
 				}
 			} else if (scaleStart?.type === 'capsule') {
-				const next = { r: scaleStart.r * ref.scale.x, l: scaleStart.l * ref.scale.y }
+				const next = {
+					r: Math.max(0, scaleStart.r * ref.scale.x),
+					l: Math.max(0, scaleStart.l * ref.scale.y),
+				}
 				if (isFrameEntity) {
 					session?.stageGeometry(entity, { type: 'capsule', ...next })
 				} else {
@@ -165,29 +182,31 @@
 		transformControls.setActive(false)
 	}
 
-	// Pose.svelte renders frame entities through the live blend
-	//   render = M(live) × M(network)⁻¹ × M(edited)
-	// so for the user's drag to render where they pulled the gizmo to, EditedPose
-	// must satisfy
-	//   M(edited) = M(network) × M(live)⁻¹ × M(ref)
-	// where M(ref) is the gizmo-driven group's parent-relative matrix in mm.
-	// When live ≈ network (no kinematic offset), this collapses to M(edited) =
-	// M(ref) — the same as the naive writeback. When they diverge (e.g. an arm
-	// whose joints have moved away from its config pose), this composition is
-	// what keeps the rendering anchored to the user's pointer instead of
-	// shearing through the live × baseline⁻¹ offset.
+	/**
+	 * Frame.svelte renders frame entities by blending M(live) × M(config)⁻¹ × M(edited)
+	 * so for the user's drag to render where they pulled the gizmo to,
+	 * EditedMatrix must satisfy M(edited) = M(config) × M(live)⁻¹ × M(ref)
+	 * where M(ref) is the gizmo-driven group's parent-relative matrix in mm.
+	 *
+	 * When live ≈ config (no kinematic offset), this collapses to
+	 * M(edited) = M(ref) — the same as the naive writeback. When they diverge
+	 * (e.g. an arm whose joints have moved away from its config pose), this
+	 * composition is what keeps the rendering anchored to the user's pointer
+	 * instead of shearing through the live × baseline⁻¹ offset.
+	 */
+
 	const stageFrameTransform = () => {
 		if (!ref || !entity) return
 
 		vector3ToPose(ref.position, refPose)
 		quaternionToPose(ref.quaternion, refPose)
 
-		const live = livePose.current
-		const network = networkPose.current
+		const live = liveMatrix.current
+		const config = configMatrix.current
 
-		if (!live || !network) {
-			// No live pose available — Pose.svelte's blend short-circuits to
-			// editedPose, so naive writeback is correct.
+		if (!live || !config) {
+			// No live matrix available — Frame.svelte's blend short-circuits to
+			// editedMatrix, so naive writeback is correct.
 			if (activeMode === 'translate') {
 				session?.stagePose(entity, {
 					x: refPose.x,
@@ -205,7 +224,11 @@
 			return
 		}
 
-		session?.stagePose(entity, composeEditedPoseForRenderedPose(network, live, refPose))
+		poseToMatrix(refPose, tempRefMatrix)
+
+		solveEditedMatrix(config, live, tempRefMatrix, tempEditedMatrix)
+		matrixToPose(tempEditedMatrix, tempPose)
+		session?.stagePose(entity, { ...tempPose })
 	}
 </script>
 

package/dist/components/StaticGeometries.svelte

@@ -29,7 +29,7 @@
 	keys.onKeys('=', () => {
 		const entity = world.spawn(
 			traits.Name(`custom geometry ${++index}`),
-			traits.Pose,
+			traits.Matrix,
 			traits.Box({ x: 100, y: 100, z: 100 }),
 			traits.Removable,
 			traits.Transformable

package/dist/components/hover/HoveredEntity.svelte

@@ -1,6 +1,11 @@
 <script lang="ts">
+	import { MathUtils, Quaternion, Vector3 } from 'three'
+
+	import type { HoverInfo } from '../../HoverUpdater.svelte'
+
 	import { traits, useTrait } from '../../ecs'
 	import { useFocusedEntity, useSelectedEntity } from '../../hooks/useSelection.svelte'
+	import { OrientationVector } from '../../three/OrientationVector'
 
 	import HoveredEntityTooltip from './HoveredEntityTooltip.svelte'
 
@@ -8,9 +13,34 @@
 	const focusedEntity = useFocusedEntity()
 
 	const displayEntity = $derived(selectedEntity.current ?? focusedEntity.current)
-	const hoverInfo = useTrait(() => displayEntity, traits.InstancedPose)
+	const instancedMatrix = useTrait(() => displayEntity, traits.InstancedMatrix)
+
+	// Pool: InstancedMatrix's `Matrix4` is in metres (matches Three.js).
+	// Decompose for the tooltip's display, which expects metres for position
+	// and OV+theta for orientation.
+	const translation = new Vector3()
+	const quaternion = new Quaternion()
+	const scaleVec = new Vector3()
+	const ov = new OrientationVector()
+
+	const hoverInfo = $derived.by((): HoverInfo | undefined => {
+		const data = instancedMatrix.current
+		if (!data) return undefined
+		data.matrix.decompose(translation, quaternion, scaleVec)
+		ov.setFromQuaternion(quaternion)
+		return {
+			index: data.index,
+			x: translation.x,
+			y: translation.y,
+			z: translation.z,
+			oX: ov.x,
+			oY: ov.y,
+			oZ: ov.z,
+			theta: MathUtils.radToDeg(ov.th),
+		}
+	})
 </script>
 
-{#if hoverInfo.current}
-	<HoveredEntityTooltip hoverInfo={hoverInfo.current} />
+{#if hoverInfo}
+	<HoveredEntityTooltip {hoverInfo} />
 {/if}

package/dist/components/hover/LinkedHoveredEntity.svelte

@@ -3,8 +3,7 @@
 
 	import { compileExpression } from 'filtrex'
 
-	import { relations, traits } from '../../ecs'
-	import { useTrait } from '../../ecs'
+	import { relations, traits, useTrait } from '../../ecs'
 	import { SubEntityLinkType } from '../../ecs/relations'
 	import { useSelectedEntity } from '../../hooks/useSelection.svelte'
 	import { useFocusedEntity } from '../../hooks/useSelection.svelte'
@@ -22,7 +21,7 @@
 	const focusedEntity = useFocusedEntity()
 	const displayEntity = $derived(selectedEntity.current ?? focusedEntity.current)
 
-	const displayedHoverInfo = useTrait(() => displayEntity, traits.InstancedPose)
+	const displayedHoverInfo = useTrait(() => displayEntity, traits.InstancedMatrix)
 
 	let hoverInfo = $state.raw<HoverInfo | null>(null)
 

package/dist/components/overlay/Details.svelte

@@ -3,22 +3,22 @@
 	lang="ts"
 >
 	import { ThemeUtils } from 'svelte-tweakpane-ui'
-	import { BufferAttribute, Euler, MathUtils, Quaternion, Vector3 } from 'three'
+	import { BufferAttribute, Euler, MathUtils, Quaternion } from 'three'
 
 	import { OrientationVector } from '../../three/OrientationVector'
 
-	const vec3 = new Vector3()
 	const quaternion = new Quaternion()
 	const ov = new OrientationVector()
 	const euler = new Euler()
 </script>
 
 <script lang="ts">
+	import type { Pose } from '@viamrobotics/sdk'
 	import type { Entity } from 'koota'
 	import type { Snippet } from 'svelte'
 
 	import { draggable } from '@neodrag/svelte'
-	import { isInstanceOf, useTask, useThrelte } from '@threlte/core'
+	import { isInstanceOf, useThrelte } from '@threlte/core'
 	import { Button, Icon, Tooltip } from '@viamrobotics/prime-core'
 	import { Check, Copy } from 'lucide-svelte'
 	import {
@@ -53,7 +53,7 @@
 		useSelectedEntity,
 		useSelectedObject3d,
 	} from '../../hooks/useSelection.svelte'
-	import { createPose } from '../../transform'
+	import { createPose, matrixToPose } from '../../transform'
 
 	interface Props {
 		details?: Snippet<[{ entity: Entity }]>
@@ -73,14 +73,17 @@
 	const environment = useEnvironment()
 	const focusedEntity = useFocusedEntity()
 	const focusedObject3d = useFocusedObject3d()
+	const linkedEntities = useLinkedEntities()
+
 	const entity = $derived(focusedEntity.current ?? selectedEntity.current)
 	const object3d = $derived(focusedObject3d.current ?? selectedObject3d.current)
-	const worldPosition = $state({ x: 0, y: 0, z: 0 })
-	const worldOrientation = $state({ x: 0, y: 0, z: 1, th: 0 })
-	const linkedEntities = useLinkedEntities()
+
 	const name = useTrait(() => entity, traits.Name)
 	const parent = useParentName(() => entity)
-	const localPose = useTrait(() => entity, traits.EditedPose)
+	const matrix = useTrait(() => entity, traits.Matrix)
+	const editedMatrix = useTrait(() => entity, traits.EditedMatrix)
+	const worldMatrix = useTrait(() => entity, traits.WorldMatrix)
+	const center = useTrait(() => entity, traits.Center)
 	const box = useTrait(() => entity, traits.Box)
 	const sphere = useTrait(() => entity, traits.Sphere)
 	const capsule = useTrait(() => entity, traits.Capsule)
@@ -88,14 +91,27 @@
 	const points = useTrait(() => entity, traits.Points)
 	const arrows = useTrait(() => entity, traits.Arrows)
 	const opacity = useTrait(() => entity, traits.Opacity)
-
 	const framesAPI = useTrait(() => entity, traits.FramesAPI)
-	const isFrameNode = $derived(!!framesAPI.current)
+	const geometriesAPI = useTrait(() => entity, traits.GeometriesAPI)
+
+	const localPose = $derived.by<Pose | undefined>(() => {
+		const source = editedMatrix.current ?? matrix.current
+		if (source) return matrixToPose(source, createPose())
+		if (center.current) return createPose(center.current)
+		return undefined
+	})
+	const worldPose = $derived.by<Pose | undefined>(() => {
+		if (!worldMatrix.current) return
+
+		return matrixToPose(worldMatrix.current, createPose())
+	})
 
+	const isFrameNode = $derived(!!framesAPI.current)
+	const isGeometry = $derived(!!geometriesAPI.current)
 	const showEditFrameOptions = $derived(isFrameNode && partConfig.hasEditPermissions)
 	const showRelationshipOptions = $derived(points.current || arrows.current)
-
 	const resourceName = $derived(name.current ? resourceByName.current[name.current] : undefined)
+	const displayType = $derived(isFrameNode ? resourceName?.subtype : isGeometry ? 'geometry' : '')
 
 	let geometryType = $derived.by<'box' | 'sphere' | 'capsule' | 'none'>(() => {
 		if (box.current) return 'box'
@@ -120,13 +136,8 @@
 	let dragElement = $state.raw<HTMLElement>()
 
 	const eulerValue = $derived.by<RotationEulerValueObject>(() => {
-		if (!localPose.current) return { x: 0, y: 0, z: 0 }
-		ov.set(
-			localPose.current.oX,
-			localPose.current.oY,
-			localPose.current.oZ,
-			MathUtils.degToRad(localPose.current.theta)
-		)
+		if (!localPose) return { x: 0, y: 0, z: 0 }
+		ov.set(localPose.oX, localPose.oY, localPose.oZ, MathUtils.degToRad(localPose.theta))
 		ov.toEuler(euler)
 		return {
 			x: MathUtils.radToDeg(euler.x),
@@ -236,65 +247,28 @@
 		}
 	}
 
-	useTask(
-		() => {
-			object3d?.getWorldPosition(vec3)
-			if (!vec3.equals(worldPosition)) {
-				worldPosition.x = vec3.x
-				worldPosition.y = vec3.y
-				worldPosition.z = vec3.z
-			}
-
-			object3d?.getWorldQuaternion(quaternion)
-			ov.setFromQuaternion(quaternion)
-
-			if (!ov.equals(worldOrientation)) {
-				worldOrientation.x = ov.x
-				worldOrientation.y = ov.y
-				worldOrientation.z = ov.z
-				worldOrientation.th = ov.th
-			}
-		},
-		{
-			autoInvalidate: false,
-			running: () => object3d !== undefined,
-		}
-	)
-
-	$effect(() => {
-		if (entity) {
-			const worldPose = createPose({
-				x: worldPosition.x,
-				y: worldPosition.y,
-				z: worldPosition.z,
-				oX: worldOrientation.x,
-				oY: worldOrientation.y,
-				oZ: worldOrientation.z,
-				theta: MathUtils.radToDeg(worldOrientation.th),
-			})
-			if (entity.has(traits.WorldPose)) {
-				entity.set(traits.WorldPose, worldPose)
-			} else {
-				entity.add(traits.WorldPose(worldPose))
-			}
-		}
-	})
-
 	const getCopyClipboardText = () => {
 		return JSON.stringify(
 			{
-				worldPosition: worldPosition,
-				worldOrientation: worldOrientation,
+				worldPosition: worldPose ? { x: worldPose.x, y: worldPose.y, z: worldPose.z } : null,
+				worldOrientation: worldPose
+					? {
+							x: worldPose.oX,
+							y: worldPose.oY,
+							z: worldPose.oZ,
+							th: MathUtils.degToRad(worldPose.theta),
+						}
+					: null,
 				localPosition: {
-					x: localPose.current?.x,
-					y: localPose.current?.y,
-					z: localPose.current?.z,
+					x: localPose?.x,
+					y: localPose?.y,
+					z: localPose?.z,
 				},
 				localOrientation: {
-					x: localPose.current?.oX,
-					y: localPose.current?.oY,
-					z: localPose.current?.oZ,
-					th: localPose.current?.theta,
+					x: localPose?.oX,
+					y: localPose?.oY,
+					z: localPose?.oZ,
+					th: localPose?.theta,
 				},
 				geometry: {
 					type: geometryType,
@@ -350,7 +324,7 @@
 		>
 			<div class="flex w-[90%] items-center gap-1">
 				<strong class="overflow-hidden text-nowrap text-ellipsis">{name.current}</strong>
-				<span class="text-subtle-2">{resourceName?.subtype}</span>
+				<span class="text-subtle-2">{displayType}</span>
 			</div>
 
 			{#if object3d}
@@ -438,15 +412,15 @@
 				<div class="flex gap-3">
 					<div>
 						<span class="text-subtle-2">x</span>
-						{(worldPosition.x * 1000).toFixed(2)}
+						{(worldPose?.x ?? 0).toFixed(2)}
 					</div>
 					<div>
 						<span class="text-subtle-2">y</span>
-						{(worldPosition.y * 1000).toFixed(2)}
+						{(worldPose?.y ?? 0).toFixed(2)}
 					</div>
 					<div>
 						<span class="text-subtle-2">z</span>
-						{(worldPosition.z * 1000).toFixed(2)}
+						{(worldPose?.z ?? 0).toFixed(2)}
 					</div>
 				</div>
 			</div>
@@ -457,19 +431,19 @@
 				<div class="flex gap-3">
 					<div>
 						<span class="text-subtle-2">x</span>
-						{worldOrientation.x.toFixed(2)}
+						{(worldPose?.oX ?? 0).toFixed(2)}
 					</div>
 					<div>
 						<span class="text-subtle-2">y</span>
-						{worldOrientation.y.toFixed(2)}
+						{(worldPose?.oY ?? 0).toFixed(2)}
 					</div>
 					<div>
 						<span class="text-subtle-2">z</span>
-						{worldOrientation.z.toFixed(2)}
+						{(worldPose?.oZ ?? 0).toFixed(2)}
 					</div>
 					<div>
 						<span class="text-subtle-2">th</span>
-						{MathUtils.radToDeg(worldOrientation.th).toFixed(2)}
+						{(worldPose?.theta ?? 0).toFixed(2)}
 					</div>
 				</div>
 			</div>
@@ -505,7 +479,7 @@
 				{/if}
 			</div>
 
-			{#if localPose.current}
+			{#if localPose}
 				<div>
 					<strong class="font-semibold">local position</strong>
 					<span class="text-subtle-2">(mm)</span>
@@ -514,9 +488,9 @@
 						<div aria-label="mutable local position">
 							<Point
 								value={{
-									x: localPose.current.x,
-									y: localPose.current.y,
-									z: localPose.current.z,
+									x: localPose.x,
+									y: localPose.y,
+									z: localPose.z,
 								}}
 								on:change={handlePositionChange}
 							/>
@@ -526,17 +500,17 @@
 							{@render ImmutableField({
 								label: 'x',
 								ariaLabel: 'local position x coordinate',
-								value: localPose.current.x,
+								value: localPose.x,
 							})}
 							{@render ImmutableField({
 								label: 'y',
 								ariaLabel: 'local position y coordinate',
-								value: localPose.current.y,
+								value: localPose.y,
 							})}
 							{@render ImmutableField({
 								label: 'z',
 								ariaLabel: 'local position z coordinate',
-								value: localPose.current.z,
+								value: localPose.z,
 							})}
 						</div>
 					{/if}
@@ -551,10 +525,10 @@
 								<TabPage title="OV (deg)">
 									<Point
 										value={{
-											x: localPose.current.oX,
-											y: localPose.current.oY,
-											z: localPose.current.oZ,
-											w: localPose.current.theta,
+											x: localPose.oX,
+											y: localPose.oY,
+											z: localPose.oZ,
+											w: localPose.theta,
 										}}
 										on:change={handleOrientationOVChange}
 									/>
@@ -573,22 +547,22 @@
 							{@render ImmutableField({
 								label: 'x',
 								ariaLabel: 'local orientation x coordinate',
-								value: localPose.current.oX,
+								value: localPose.oX,
 							})}
 							{@render ImmutableField({
 								label: 'y',
 								ariaLabel: 'local orientation y coordinate',
-								value: localPose.current.oY,
+								value: localPose.oY,
 							})}
 							{@render ImmutableField({
 								label: 'z',
 								ariaLabel: 'local orientation z coordinate',
-								value: localPose.current.oZ,
+								value: localPose.oZ,
 							})}
 							{@render ImmutableField({
 								label: 'th',
 								ariaLabel: 'local orientation theta degrees',
-								value: localPose.current.theta,
+								value: localPose.theta,
 							})}
 						</div>
 					{/if}
@@ -611,6 +585,7 @@
 												y: box.current.y,
 												z: box.current.z,
 											}}
+											min={0}
 											on:change={handleBoxChange}
 										/>
 									</div>
@@ -622,6 +597,7 @@
 										<Slider
 											label="r"
 											value={sphere.current.r}
+											min={0}
 											on:change={handleSphereRChange}
 										/>
 									</div>
@@ -633,11 +609,13 @@
 										<Slider
 											label="r"
 											value={capsule.current.r}
+											min={0}
 											on:change={handleCapsuleRChange}
 										/>
 										<Slider
 											label="l"
 											value={capsule.current.l}
+											min={0}
 											on:change={handleCapsuleLChange}
 										/>
 									</div>

package/dist/components/overlay/__tests__/__fixtures__/entity.js

@@ -1,20 +1,17 @@
+import { Matrix4 } from 'three';
 import { hierarchy, traits } from '../../../../ecs';
+import { createPose, poseToMatrix } from '../../../../transform';
+// OV must be a unit vector — (0.6, 0.8, 0) magnitude 1 — so the matrix
+// round-trip in Details.svelte returns the same components.
+const buildMatrix = () => poseToMatrix(createPose({
+    x: 10,
+    y: 20,
+    z: 30,
+    oX: 0.6,
+    oY: 0.8,
+    oZ: 0,
+    theta: 0.4,
+}), new Matrix4());
 export const createEntityFixture = (world) => {
-    return world.spawn(...hierarchy.parentTraits('parent_frame'), traits.Name('Test Object'), traits.Pose({
-        x: 10,
-        y: 20,
-        z: 30,
-        oX: 0.1,
-        oY: 0.2,
-        oZ: 0.3,
-        theta: 0.4,
-    }), traits.EditedPose({
-        x: 10,
-        y: 20,
-        z: 30,
-        oX: 0.1,
-        oY: 0.2,
-        oZ: 0.3,
-        theta: 0.4,
-    }), traits.Box({ x: 0.01, y: 0.02, z: 0.03 }));
+    return world.spawn(...hierarchy.parentTraits('parent_frame'), traits.Name('Test Object'), traits.Matrix(buildMatrix()), traits.EditedMatrix(buildMatrix()), traits.Box({ x: 0.01, y: 0.02, z: 0.03 }));
 };