app-16292: small component tweaks to support per-entity pose mutators

.changeset/component-tweaks-for-gizmo-mode.md

@@ -0,0 +1,5 @@
+---
+'@viamrobotics/motion-tools': patch
+---
+
+Default `Line` and `Mesh` opacity to `1`, fix `LineDots` instance ID tracking, enable BVH raycasting in `'gizmo'` interaction mode, fix stale matrix reads in `SelectedTransformControls`, and add `isOpen` / `close` to `Popover` snippets plus a `shapes` icon and `disableTooltip` prop on dashboard `Button`

.changeset/details-panel-subcomponents.md

@@ -0,0 +1,5 @@
+---
+'@viamrobotics/motion-tools': patch
+---
+
+Split the Details overlay into focused subcomponents under `details/` and expose a `details-extensions` portal target for plugin-supplied editors

.changeset/gizmo-foundation-utils.md

@@ -0,0 +1,5 @@
+---
+'@viamrobotics/motion-tools': patch
+---
+
+Add `writeMatrix` and `CustomDetails` ECS traits, a `firstHitOnly` raycaster option, and a `'gizmo'` interaction mode

src/lib/components/Entities/Line.svelte

@@ -58,7 +58,7 @@
 		return rgb
 	})
 
-	const currentOpacity = $derived(opacity.current ?? 0.7)
+	const currentOpacity = $derived(opacity.current ?? 1)
 
 	const mesh = new Line2()
 	mesh.matrixAutoUpdate = false

src/lib/components/Entities/LineDots.svelte

@@ -41,9 +41,15 @@
 
 	$effect(() => {
 		if (!positions) return
+		// Track the IDs `addInstance` returns rather than assuming they're a
+		// sequential 0..N-1 range — when positions changes (e.g. a line gizmo
+		// being placed), cleanup-by-index would target slots that were never
+		// allocated for this effect run and throw "Invalid instanceId".
+		const instances: number[] = []
 		for (let i = 0, l = positions.length; i < l; i += 3) {
 			const dotIndex = i / 3
 			const instance = mesh.addInstance(geometryID)
+			instances.push(instance)
 			matrix.makeTranslation(positions[i + 0], positions[i + 1], positions[i + 2])
 			matrix.scale(vec3.setScalar(scale))
 			mesh.setMatrixAt(instance, matrix)
@@ -55,9 +61,8 @@
 		}
 
 		return () => {
-			if (!positions) return
-			for (let i = 0, l = positions.length / 3; i < l; i += 1) {
-				mesh.deleteInstance(i)
+			for (const instance of instances) {
+				mesh.deleteInstance(instance)
 			}
 		}
 	})

src/lib/components/Entities/Mesh.svelte

@@ -70,7 +70,7 @@
 		return colors.default
 	})
 
-	const currentOpacity = $derived(opacity.current ?? 0.7)
+	const currentOpacity = $derived(opacity.current ?? 1)
 
 	const isCapsule = $derived(capsule.current !== undefined)
 

src/lib/components/Scene.svelte

@@ -54,7 +54,8 @@
 	const bvhEnabled = $derived(
 		settings.current.renderSubEntityHoverDetail ||
 			settings.current.interactionMode === 'measure' ||
-			settings.current.interactionMode === 'select'
+			settings.current.interactionMode === 'select' ||
+			settings.current.interactionMode === 'gizmo'
 	)
 
 	bvh(raycaster, () => ({ helper: false, enabled: bvhEnabled }))

src/lib/components/SelectedTransformControls.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { TransformControls } from '@threlte/extras'
-	import { Matrix4, Quaternion, Vector3 } from 'three'
+	import { Matrix4 } from 'three'
 
 	import type { FrameEditSession } from '$lib/editing/FrameEditSession'
 
@@ -64,8 +64,6 @@
 	const isSphereScale = $derived(activeMode === 'scale' && sphere.current !== undefined)
 	const isCapsuleScale = $derived(activeMode === 'scale' && capsule.current !== undefined)
 
-	const quaternion = new Quaternion()
-	const vector3 = new Vector3()
 	const refPose = createPose()
 	const tempRefMatrix = new Matrix4()
 	const tempEditedMatrix = new Matrix4()
@@ -131,11 +129,19 @@
 				const matrix = entity.get(traits.Matrix)
 				if (matrix) {
 					matrixToPose(matrix, tempPose)
+					// Frame-style renderers (Frame.svelte, GizmoPlane, GizmoArrow,
+					// etc.) set `group.matrixAutoUpdate = false` and re-compose the
+					// matrix from `worldMatrix` on every flush. Under that flag,
+					// `getWorldQuaternion`/`getWorldPosition` skip updating the
+					// local matrix and return the stale pre-drag transform — so
+					// the gizmo handles move visually but the entity never
+					// actually rotates/translates. Read what TransformControls
+					// wrote into the local fields directly. Renderers mount under
+					// an identity-ish root, so local ≈ world here.
 					if (activeMode === 'translate') {
-						vector3ToPose(ref.getWorldPosition(vector3), tempPose)
+						vector3ToPose(ref.position, tempPose)
 					} else {
-						quaternionToPose(ref.getWorldQuaternion(quaternion), tempPose)
-						ref.quaternion.copy(quaternion)
+						quaternionToPose(ref.quaternion, tempPose)
 					}
 					poseToMatrix(tempPose, matrix)
 					entity.changed(traits.Matrix)