@viamrobotics/motion-tools 1.13.1 → 1.15.0

package/dist/components/Focus.svelte

@@ -1,11 +1,13 @@
 <script lang="ts">
 	import { T } from '@threlte/core'
-	import { TrackballControls, Gizmo, Portal } from '@threlte/extras'
+	import { Gizmo, Portal, TrackballControls } from '@threlte/extras'
 	import { Box3, type Object3D, Vector3 } from 'three'
 	import { TrackballControls as ThreeTrackballControls } from 'three/examples/jsm/controls/TrackballControls.js'
-	import Camera from './Camera.svelte'
+
 	import Button from './overlay/dashboard/Button.svelte'
 
+	import Camera from './Camera.svelte'
+
 	interface Props {
 		object3d: Object3D
 	}

package/dist/components/KeyboardControls.svelte

@@ -1,8 +1,10 @@
 <script lang="ts">
-	import { MathUtils } from 'three'
-	import { useTask } from '@threlte/core'
 	import type { CameraControlsRef } from '@threlte/extras'
+
+	import { useTask } from '@threlte/core'
 	import { PressedKeys } from 'runed'
+	import { MathUtils } from 'three'
+
 	import { useFocusedEntity, useSelectedEntity } from '../hooks/useSelection.svelte'
 	import { useSettings } from '../hooks/useSettings.svelte'
 	import { useVisibility } from '../hooks/useVisibility.svelte'

package/dist/components/Lasso/Debug.svelte

@@ -4,10 +4,13 @@
 Shows all steps for querying points within a lasso selection
 -->
 <script lang="ts">
+	import type { Entity } from 'koota'
+
 	import { T } from '@threlte/core'
 	import { Box3, BufferAttribute, BufferGeometry, Vector3 } from 'three'
-	import { useTrait, traits } from '../../ecs'
-	import type { Entity } from 'koota'
+
+	import { traits, useTrait } from '../../ecs'
+
 	import * as lassoTraits from './traits'
 
 	const box3 = new Box3()

package/dist/components/Lasso/Lasso.svelte

@@ -1,14 +1,17 @@
 <script lang="ts">
-	import { Raycaster, Box3, Vector3, Vector2, Plane, Triangle } from 'three'
+	import type { ShapecastCallbacks } from 'three-mesh-bvh'
+
 	import { useThrelte } from '@threlte/core'
-	import { Not } from 'koota'
-	import { useCameraControls } from '../../hooks/useControls.svelte'
 	import earcut from 'earcut'
-	import { traits, useQuery, useWorld } from '../../ecs'
-	import type { ShapecastCallbacks } from 'three-mesh-bvh'
+	import { Not } from 'koota'
+	import { Box3, Plane, Raycaster, Triangle, Vector2, Vector3 } from 'three'
+
 	import { createBufferGeometry } from '../../attribute'
-	import * as lassoTraits from './traits'
+	import { traits, useQuery, useWorld } from '../../ecs'
+	import { useCameraControls } from '../../hooks/useControls.svelte'
+
 	import Debug from './Debug.svelte'
+	import * as lassoTraits from './traits'
 
 	interface Props {
 		debug?: boolean

package/dist/components/Lasso/Tool.svelte

@@ -1,17 +1,20 @@
 <script lang="ts">
+	import type { BufferGeometry } from 'three'
+
+	import { useThrelte } from '@threlte/core'
 	import { Portal } from '@threlte/extras'
 	import { Button } from '@viamrobotics/prime-core'
-	import Lasso from './Lasso.svelte'
+	import { ElementRect } from 'runed'
+	import { BufferGeometryUtils } from 'three/examples/jsm/Addons.js'
+
 	import DashboardButton from '../overlay/dashboard/Button.svelte'
+	import { traits, useWorld } from '../../ecs'
 	import { useSettings } from '../../hooks/useSettings.svelte'
+	import { createBinaryPCD } from '../../pcd'
+
 	import FloatingPanel from '../overlay/FloatingPanel.svelte'
-	import { traits, useWorld } from '../../ecs'
+	import Lasso from './Lasso.svelte'
 	import * as lassoTraits from './traits'
-	import { BufferGeometryUtils } from 'three/examples/jsm/Addons.js'
-	import { createBinaryPCD } from '../../pcd'
-	import type { BufferGeometry } from 'three'
-	import { useThrelte } from '@threlte/core'
-	import { ElementRect } from 'runed'
 
 	interface Props {
 		/** Whether to auto-enable lasso mode when the component mounts */

package/dist/components/MeasureTool/MeasurePoint.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
+	import type { Group, Vector3Tuple } from 'three'
+
 	import { T, type Props as ThrelteProps } from '@threlte/core'
-	import type { Vector3Tuple, Group } from 'three'
 	import { HTML } from '@threlte/extras'
 
 	interface Props extends ThrelteProps<typeof Group> {

package/dist/components/MeasureTool/MeasurePoint.svelte.d.ts

@@ -1,5 +1,5 @@
+import type { Group, Vector3Tuple } from 'three';
 import { type Props as ThrelteProps } from '@threlte/core';
-import type { Vector3Tuple, Group } from 'three';
 interface Props extends ThrelteProps<typeof Group> {
     position: Vector3Tuple;
 }

package/dist/components/MeasureTool/MeasureTool.svelte

@@ -1,15 +1,17 @@
 <script lang="ts">
-	import { untrack } from 'svelte'
-	import { Vector3, type Intersection } from 'three'
 	import { T } from '@threlte/core'
 	import { HTML, MeshLineGeometry, MeshLineMaterial, Portal } from '@threlte/extras'
-	import { useSettings } from '../../hooks/useSettings.svelte'
+	import { untrack } from 'svelte'
+	import { type Intersection, Vector3 } from 'three'
+
 	import Button from '../overlay/dashboard/Button.svelte'
-	import MeasurePoint from './MeasurePoint.svelte'
 	import { useMouseRaycaster } from '../../hooks/useMouseRaycaster.svelte'
 	import { useFocusedEntity } from '../../hooks/useSelection.svelte'
-	import ToggleGroup from '../overlay/ToggleGroup.svelte'
+	import { useSettings } from '../../hooks/useSettings.svelte'
+
 	import Popover from '../overlay/Popover.svelte'
+	import ToggleGroup from '../overlay/ToggleGroup.svelte'
+	import MeasurePoint from './MeasurePoint.svelte'
 
 	const focusedEntity = useFocusedEntity()
 	const settings = useSettings()

package/dist/components/PCD.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
-	import { parsePcdInWorker } from '../lib'
-	import { traits, useWorld } from '../ecs'
-	import { createBufferGeometry } from '../attribute'
 	import type { ConfigurableTrait, Entity } from 'koota'
 
+	import { createBufferGeometry } from '../attribute'
+	import { traits, useWorld } from '../ecs'
+	import { parsePcdInWorker } from '../lib'
+
 	interface Props {
 		data: Uint8Array
 		name?: string

package/dist/components/PointerMissBox.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
-	import { BackSide, Mesh, Vector3 } from 'three'
 	import { T, useThrelte } from '@threlte/core'
 	import { MeshDiscardMaterial } from '@threlte/extras'
-	import { useSelectedEntity } from '../hooks/useSelection.svelte'
+	import { BackSide, Mesh, Vector3 } from 'three'
+
 	import { useTransformControls } from '../hooks/useControls.svelte'
+	import { useSelectedEntity } from '../hooks/useSelection.svelte'
 	import { useSettings } from '../hooks/useSettings.svelte'
 
 	const { camera } = useThrelte()

package/dist/components/Scene.svelte

@@ -1,23 +1,26 @@
 <script lang="ts">
-	import { ShaderMaterial, Vector3 } from 'three'
+	import type { Snippet } from 'svelte'
+
 	import { T } from '@threlte/core'
 	import { Environment, Grid, interactivity, PerfMonitor, PortalTarget } from '@threlte/extras'
+	import { useXR } from '@threlte/xr'
+	import { ShaderMaterial, Vector3 } from 'three'
+
+	import Camera from './Camera.svelte'
 	import Entities from './Entities/Entities.svelte'
-	import Selected from './Selected.svelte'
 	import Focus from './Focus.svelte'
+	import Selected from './Selected.svelte'
 	import StaticGeometries from './StaticGeometries.svelte'
-	import Camera from './Camera.svelte'
 	import { useFocusedObject3d } from '../hooks/useSelection.svelte'
-	import type { Snippet } from 'svelte'
-	import { useXR } from '@threlte/xr'
-	import { bvh } from '../plugins/bvh.svelte'
-	import { useOrigin } from './xr/useOrigin.svelte'
 	import { useSettings } from '../hooks/useSettings.svelte'
+	import { bvh } from '../plugins/bvh.svelte'
+
+	import hdrImage from '../assets/ferndale_studio_11_1k.hdr'
+	import BatchedArrows from './BatchedArrows.svelte'
 	import CameraControls from './CameraControls.svelte'
 	import MeasureTool from './MeasureTool/MeasureTool.svelte'
 	import PointerMissBox from './PointerMissBox.svelte'
-	import BatchedArrows from './BatchedArrows.svelte'
-	import hdrImage from '../assets/ferndale_studio_11_1k.hdr'
+	import { useOrigin } from './xr/useOrigin.svelte'
 
 	interface Props {
 		children?: Snippet

package/dist/components/SceneProviders.svelte

@@ -1,29 +1,31 @@
 <script lang="ts">
 	import type { Snippet } from 'svelte'
-	import { provideFrames } from '../hooks/useFrames.svelte'
-	import { provideGeometries } from '../hooks/useGeometries.svelte'
-	import { providePointclouds } from '../hooks/usePointclouds.svelte'
-	import { usePartID } from '../hooks/usePartID.svelte'
-	import { provideSelection } from '../hooks/useSelection.svelte'
-	import { provideVisibility } from '../hooks/useVisibility.svelte'
-	import { provideDrawAPI } from '../hooks/useDrawAPI.svelte'
-	import { provideMachineSettings } from '../hooks/useMachineSettings.svelte'
+
+	import { provide3DModels } from '../hooks/use3DModels.svelte'
+	import { provideArmClient } from '../hooks/useArmClient.svelte'
+	import { provideArmKinematics } from '../hooks/useArmKinematics.svelte'
+	import { provideConfigFrames } from '../hooks/useConfigFrames.svelte'
 	import {
+		type CameraPose,
 		provideCameraControls,
 		provideTransformControls,
-		type CameraPose,
 	} from '../hooks/useControls.svelte'
-	import { provideLogs } from '../hooks/useLogs.svelte'
-	import { provideOrigin } from './xr/useOrigin.svelte'
-	import { provideWorldStates } from '../hooks/useWorldState.svelte'
-	import { provideArmClient } from '../hooks/useArmClient.svelte'
-	import { provideArmKinematics } from '../hooks/useArmKinematics.svelte'
+	import { provideDrawAPI } from '../hooks/useDrawAPI.svelte'
 	import { provideFramelessComponents } from '../hooks/useFramelessComponents.svelte'
-	import { provideResourceByName } from '../hooks/useResourceByName.svelte'
-	import { provide3DModels } from '../hooks/use3DModels.svelte'
-	import { providePointcloudObjects } from '../hooks/usePointcloudObjects.svelte'
+	import { provideFrames } from '../hooks/useFrames.svelte'
+	import { provideGeometries } from '../hooks/useGeometries.svelte'
 	import { provideLinkedEntities } from '../hooks/useLinked.svelte'
-	import { provideConfigFrames } from '../hooks/useConfigFrames.svelte'
+	import { provideLogs } from '../hooks/useLogs.svelte'
+	import { provideMachineSettings } from '../hooks/useMachineSettings.svelte'
+	import { usePartID } from '../hooks/usePartID.svelte'
+	import { providePointcloudObjects } from '../hooks/usePointcloudObjects.svelte'
+	import { providePointclouds } from '../hooks/usePointclouds.svelte'
+	import { provideResourceByName } from '../hooks/useResourceByName.svelte'
+	import { provideSelection } from '../hooks/useSelection.svelte'
+	import { provideVisibility } from '../hooks/useVisibility.svelte'
+	import { provideWorldStates } from '../hooks/useWorldState.svelte'
+
+	import { provideOrigin } from './xr/useOrigin.svelte'
 
 	interface Props {
 		cameraPose?: CameraPose

package/dist/components/Selected.svelte

@@ -1,11 +1,13 @@
 <script lang="ts">
 	import { isInstanceOf, T, useTask, useThrelte } from '@threlte/core'
-	import { useSelectedEntity, useSelectedObject3d } from '../hooks/useSelection.svelte'
-	import { OBBHelper } from '../three/OBBHelper'
-	import { OBB } from 'three/addons/math/OBB.js'
 	import { BatchedMesh, Box3 } from 'three'
+	import { OBB } from 'three/addons/math/OBB.js'
+
 	import type { InstancedArrows } from '../three/InstancedArrows/InstancedArrows'
 
+	import { useSelectedEntity, useSelectedObject3d } from '../hooks/useSelection.svelte'
+	import { OBBHelper } from '../three/OBBHelper'
+
 	const box3 = new Box3()
 	const obb = new OBB()
 	const obbHelper = new OBBHelper()
@@ -46,6 +48,8 @@
 				selectedObject3d.current?.getWorldPosition(object.position)
 				selectedObject3d.current?.getWorldQuaternion(object.quaternion)
 				obbHelper.setFromObject(object)
+			} else {
+				obbHelper.setFromObject(object)
 			}
 
 			invalidate()

package/dist/components/Snapshot.svelte

@@ -14,15 +14,18 @@ Renders a Snapshot protobuf by spawning its transforms and drawings as entities
 ```
 -->
 <script lang="ts">
-	import type { Snapshot as SnapshotProto } from '../buf/draw/v1/snapshot_pb'
-	import { useWorld } from '../ecs'
-	import { useSettings } from '../hooks/useSettings.svelte'
-	import { spawnSnapshotEntities, destroyEntities, applySceneMetadata } from '../snapshot'
-	import { useCameraControls } from '../hooks/useControls.svelte'
 	import type { Entity } from 'koota'
+
 	import { untrack } from 'svelte'
 	import { onDestroy } from 'svelte'
 
+	import type { Snapshot as SnapshotProto } from '../buf/draw/v1/snapshot_pb'
+
+	import { useWorld } from '../ecs'
+	import { useCameraControls } from '../hooks/useControls.svelte'
+	import { useSettings } from '../hooks/useSettings.svelte'
+	import { applySceneMetadata, destroyEntities, spawnSnapshotEntities } from '../snapshot'
+
 	interface Props {
 		snapshot: SnapshotProto
 	}

package/dist/components/StaticGeometries.svelte

@@ -6,17 +6,20 @@
 </script>
 
 <script lang="ts">
+	import type { Entity } from 'koota'
+
 	import { TransformControls } from '@threlte/extras'
-	import { useSelectedEntity } from '../hooks/useSelection.svelte'
-	import { useTransformControls } from '../hooks/useControls.svelte'
 	import { PressedKeys } from 'runed'
-	import { quaternionToPose, vector3ToPose } from '../transform'
+	import { SvelteSet } from 'svelte/reactivity'
 	import { Quaternion, Vector3 } from 'three'
-	import Frame from './Entities/Frame.svelte'
+
+	import { traits, useWorld } from '../ecs'
+	import { useTransformControls } from '../hooks/useControls.svelte'
+	import { useSelectedEntity } from '../hooks/useSelection.svelte'
 	import { useSettings } from '../hooks/useSettings.svelte'
-	import { useWorld, traits } from '../ecs'
-	import type { Entity } from 'koota'
-	import { SvelteSet } from 'svelte/reactivity'
+	import { quaternionToPose, vector3ToPose } from '../transform'
+
+	import Frame from './Entities/Frame.svelte'
 
 	const world = useWorld()
 	const settings = useSettings()

package/dist/components/hover/HoveredEntities.svelte

@@ -1,10 +1,11 @@
 <script lang="ts">
 	import { traits, useTrait } from '../../ecs'
+	import { useLinkedEntities } from '../../hooks/useLinked.svelte'
 	import { useSelectedEntity } from '../../hooks/useSelection.svelte'
 	import { useFocusedEntity } from '../../hooks/useSelection.svelte'
+
 	import HoveredEntity from './HoveredEntity.svelte'
 	import LinkedHoveredEntity from './LinkedHoveredEntity.svelte'
-	import { useLinkedEntities } from '../../hooks/useLinked.svelte'
 
 	const selectedEntity = useSelectedEntity()
 	const focusedEntity = useFocusedEntity()

package/dist/components/hover/HoveredEntity.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
 	import { traits, useTrait } from '../../ecs'
-	import HoveredEntityTooltip from './HoveredEntityTooltip.svelte'
 	import { useFocusedEntity, useSelectedEntity } from '../../hooks/useSelection.svelte'
 
+	import HoveredEntityTooltip from './HoveredEntityTooltip.svelte'
+
 	const selectedEntity = useSelectedEntity()
 	const focusedEntity = useFocusedEntity()
 

package/dist/components/hover/HoveredEntityTooltip.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { HTML } from '@threlte/extras'
+
 	import { type HoverInfo } from '../../HoverUpdater.svelte'
 
 	interface Props {

package/dist/components/hover/LinkedHoveredEntity.svelte

@@ -8,14 +8,16 @@
 </script>
 
 <script lang="ts">
-	import { relations, traits } from '../../ecs'
 	import type { Entity } from 'koota'
-	import HoveredEntityTooltip from './HoveredEntityTooltip.svelte'
-	import { getLinkedHoverInfo, type HoverInfo } from '../../HoverUpdater.svelte'
-	import { useSelectedEntity } from '../../hooks/useSelection.svelte'
-	import { useFocusedEntity } from '../../hooks/useSelection.svelte'
+
+	import { relations, traits } from '../../ecs'
 	import { useTrait } from '../../ecs'
 	import { SubEntityLinkType } from '../../ecs/relations'
+	import { useSelectedEntity } from '../../hooks/useSelection.svelte'
+	import { useFocusedEntity } from '../../hooks/useSelection.svelte'
+	import { getLinkedHoverInfo, type HoverInfo } from '../../HoverUpdater.svelte'
+
+	import HoveredEntityTooltip from './HoveredEntityTooltip.svelte'
 
 	interface Props {
 		linkedEntity: Entity

package/dist/components/overlay/AddRelationship.svelte

@@ -1,7 +1,9 @@
 <script lang="ts">
 	import type { Entity } from 'koota'
-	import { Button, Select, Input } from '@viamrobotics/prime-core'
-	import { traits, useQuery, relations, useTrait } from '../../ecs'
+
+	import { Button, Input, Select } from '@viamrobotics/prime-core'
+
+	import { relations, traits, useQuery, useTrait } from '../../ecs'
 	import { SubEntityLinkType } from '../../ecs/relations'
 
 	interface Props {

package/dist/components/overlay/Details.svelte

@@ -2,8 +2,9 @@
 	module
 	lang="ts"
 >
+	import { BufferAttribute, MathUtils, Quaternion, Vector3 } from 'three'
+
 	import { OrientationVector } from '../../three/OrientationVector'
-	import { Quaternion, Vector3, MathUtils, BufferAttribute } from 'three'
 
 	const vec3 = new Vector3()
 	const quaternion = new Quaternion()
@@ -12,24 +13,25 @@
 
 <script lang="ts">
 	import { draggable } from '@neodrag/svelte'
+	import { isInstanceOf, useTask } from '@threlte/core'
+	import { Button, Icon, Input, Select, Tooltip } from '@viamrobotics/prime-core'
 	import { Check, Copy } from 'lucide-svelte'
-	import { useTask, isInstanceOf } from '@threlte/core'
-	import { Button, Icon, Select, Input, Tooltip } from '@viamrobotics/prime-core'
+
+	import AddRelationship from './AddRelationship.svelte'
+	import { relations, traits, useTrait, useWorld } from '../../ecs'
+	import { FrameConfigUpdater } from '../../FrameConfigUpdater.svelte'
+	import { useConfigFrames } from '../../hooks/useConfigFrames.svelte'
+	import { useCameraControls } from '../../hooks/useControls.svelte'
+	import { useEnvironment } from '../../hooks/useEnvironment.svelte'
+	import { useLinkedEntities } from '../../hooks/useLinked.svelte'
+	import { usePartConfig } from '../../hooks/usePartConfig.svelte'
+	import { useResourceByName } from '../../hooks/useResourceByName.svelte'
 	import {
-		useSelectedEntity,
 		useFocusedEntity,
 		useFocusedObject3d,
+		useSelectedEntity,
 		useSelectedObject3d,
 	} from '../../hooks/useSelection.svelte'
-	import { useConfigFrames } from '../../hooks/useConfigFrames.svelte'
-	import { usePartConfig } from '../../hooks/usePartConfig.svelte'
-	import { FrameConfigUpdater } from '../../FrameConfigUpdater.svelte'
-	import { useEnvironment } from '../../hooks/useEnvironment.svelte'
-	import { traits, useTrait, useWorld, relations } from '../../ecs'
-	import { useResourceByName } from '../../hooks/useResourceByName.svelte'
-	import { useCameraControls } from '../../hooks/useControls.svelte'
-	import { useLinkedEntities } from '../../hooks/useLinked.svelte'
-	import AddRelationship from './AddRelationship.svelte'
 	import { createPose } from '../../transform'
 
 	const { ...rest } = $props()
@@ -259,18 +261,18 @@
 		id="details-panel"
 		class="border-medium bg-extralight absolute top-0 right-0 z-4 m-2 {showEditFrameOptions
 			? 'w-80'
-			: 'w-60'} border p-2 text-xs"
+			: 'w-60'} border p-2 text-xs dark:text-black"
 		use:draggable={{
 			bounds: 'body',
 			handle: dragElement,
 		}}
 		{...rest}
 	>
-		<div class="flex items-center justify-between gap-2 pb-2">
-			<div class="flex w-[80%] items-center gap-1">
-				<button bind:this={dragElement}>
-					<Icon name="drag" />
-				</button>
+		<div
+			class="flex cursor-move items-center justify-between gap-2 pb-2"
+			bind:this={dragElement}
+		>
+			<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>
 			</div>

package/dist/components/overlay/FloatingPanel.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import type { Snippet } from 'svelte'
-	import { Icon } from '@viamrobotics/prime-core'
 
+	import { Icon } from '@viamrobotics/prime-core'
 	import * as floatingPanel from '@zag-js/floating-panel'
 	import { normalizeProps, useMachine } from '@zag-js/svelte'
 
@@ -10,6 +10,7 @@
 		defaultSize?: { width: number; height: number }
 		defaultPosition?: { x: number; y: number }
 		exitable?: boolean
+		resizable?: boolean
 		persistRect?: boolean
 		strategy?: 'absolute' | 'fixed'
 		isOpen?: boolean
@@ -20,6 +21,7 @@
 		title = '',
 		defaultSize = { width: 700, height: 500 },
 		exitable = true,
+		resizable = false,
 		persistRect = true,
 		isOpen = $bindable(false),
 		children,
@@ -30,7 +32,7 @@
 	const floatingPanelService = useMachine(floatingPanel.machine, () => ({
 		id,
 		defaultSize,
-		resizable: false,
+		resizable,
 		allowOverflow: false,
 		persistRect,
 		open: isOpen,
@@ -46,7 +48,7 @@
 >
 	<div
 		{...api.getContentProps()}
-		class="border-medium border-1 bg-white"
+		class="border-medium border-1 bg-white dark:text-black"
 	>
 		<div
 			{...api.getDragTriggerProps()}
@@ -85,5 +87,40 @@
 		>
 			{@render children()}
 		</div>
+
+		{#if resizable}
+			<div
+				{...api.getResizeTriggerProps({ axis: 'n' })}
+				class="h-1.5 max-w-[90%]"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 'e' })}
+				class="max-h-[90%] w-1.5"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 'w' })}
+				class="max-h-[90%] w-1.5"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 's' })}
+				class="h-1.5 max-w-[90%]"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 'ne' })}
+				class="size-2.5"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 'se' })}
+				class="size-2.5"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 'sw' })}
+				class="size-2.5"
+			></div>
+			<div
+				{...api.getResizeTriggerProps({ axis: 'nw' })}
+				class="size-2.5"
+			></div>
+		{/if}
 	</div>
 </div>

package/dist/components/overlay/FloatingPanel.svelte.d.ts

@@ -10,6 +10,7 @@ interface Props {
         y: number;
     };
     exitable?: boolean;
+    resizable?: boolean;
     persistRect?: boolean;
     strategy?: 'absolute' | 'fixed';
     isOpen?: boolean;

package/dist/components/overlay/LiveUpdatesBanner.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	import { Button, Icon } from '@viamrobotics/prime-core'
+
 	import { usePartConfig } from '../../hooks/usePartConfig.svelte'
 
 	const partConfig = usePartConfig()

package/dist/components/overlay/Logs.svelte

@@ -1,9 +1,11 @@
 <script lang="ts">
 	import { Portal } from '@threlte/extras'
+	import { PersistedState } from 'runed'
+
 	import { useLogs } from '../../hooks/useLogs.svelte'
-	import FloatingPanel from './FloatingPanel.svelte'
+
 	import DashboardButton from './dashboard/Button.svelte'
-	import { PersistedState } from 'runed'
+	import FloatingPanel from './FloatingPanel.svelte'
 
 	const logs = useLogs()
 

package/dist/components/overlay/Popover.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
-	import * as popover from '@zag-js/popover'
-	import { portal, useMachine, normalizeProps } from '@zag-js/svelte'
 	import type { Snippet } from 'svelte'
 	import type { HTMLButtonAttributes } from 'svelte/elements'
 
+	import * as popover from '@zag-js/popover'
+	import { normalizeProps, portal, useMachine } from '@zag-js/svelte'
+
 	interface Props {
 		trigger: Snippet<[HTMLButtonAttributes]>
 		children: Snippet

package/dist/components/overlay/RefreshRate.svelte

@@ -16,10 +16,12 @@
 </script>
 
 <script lang="ts">
-	import { Select, IconButton } from '@viamrobotics/prime-core'
-	import { useMachineSettings } from '../../hooks/useMachineSettings.svelte'
 	import type { Snippet } from 'svelte'
 
+	import { IconButton, Select } from '@viamrobotics/prime-core'
+
+	import { useMachineSettings } from '../../hooks/useMachineSettings.svelte'
+
 	interface Props {
 		id: string
 		label: string

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

@@ -1,7 +1,8 @@
 <script lang="ts">
+	import type { ClassValue, HTMLButtonAttributes, MouseEventHandler } from 'svelte/elements'
+
 	import { Icon, type IconName, Tooltip } from '@viamrobotics/prime-core'
 	import { Ruler } from 'lucide-svelte'
-	import type { ClassValue, HTMLButtonAttributes, MouseEventHandler } from 'svelte/elements'
 
 	interface Props extends HTMLButtonAttributes {
 		icon: IconName | 'ruler'

package/dist/components/overlay/dashboard/Button.svelte.d.ts

@@ -1,5 +1,5 @@
-import { type IconName } from '@viamrobotics/prime-core';
 import type { ClassValue, HTMLButtonAttributes, MouseEventHandler } from 'svelte/elements';
+import { type IconName } from '@viamrobotics/prime-core';
 interface Props extends HTMLButtonAttributes {
     icon: IconName | 'ruler';
     active?: boolean;