@viamrobotics/motion-tools 1.34.3 → 1.34.4

package/dist/components/App.svelte

@@ -30,7 +30,6 @@
 	import HoveredEntities from './hover/HoveredEntities.svelte'
 	import AddFrames from './overlay/AddFrames.svelte'
 	import LiveUpdatesBanner from './overlay/LiveUpdatesBanner.svelte'
-	import Logs from './overlay/Logs.svelte'
 	import ArmPositions from './overlay/widgets/ArmPositions.svelte'
 	import Camera from './overlay/widgets/Camera.svelte'
 	import FramePov from './overlay/widgets/FramePov.svelte'
@@ -173,7 +172,6 @@
 				<PortalTarget id="dom" />
 
 				<Settings {settingsTabs} />
-				<Logs />
 				<AddFrames />
 			</div>
 		</SceneProviders>

package/dist/components/SceneProviders.svelte

@@ -13,7 +13,6 @@
 	import { provideGeometries } from '../hooks/useGeometries.svelte'
 	import { provideInheritedInvisible } from '../hooks/useInheritedInvisible.svelte'
 	import { provideLinkedEntities } from '../hooks/useLinked.svelte'
-	import { provideLogs } from '../hooks/useLogs.svelte'
 	import { usePartID } from '../hooks/usePartID.svelte'
 	import { providePointcloudObjects } from '../hooks/usePointcloudObjects.svelte'
 	import { providePointclouds } from '../hooks/usePointclouds.svelte'
@@ -30,7 +29,6 @@
 	const partID = usePartID()
 
 	provideTransformControls()
-	provideLogs()
 
 	provideHierarchy()
 	provideWorldMatrix()

package/dist/hooks/useFrames.svelte.js

@@ -5,11 +5,11 @@ import { getContext, setContext, untrack } from 'svelte';
 import { Matrix4 } from 'three';
 import { resourceNameToColor, subtypeToColor } from '../color';
 import { hierarchy, traits, useWorld } from '../ecs';
+import { useLogs } from '../plugins';
 import { createPose, isPoseEqual, poseToMatrix } from '../transform';
 import { useConfigFrames } from './useConfigFrames.svelte';
 import { useEnvironment } from './useEnvironment.svelte';
 import { useFrameEditSession } from './useFrameEditSession.svelte';
-import { useLogs } from './useLogs.svelte';
 import { usePartConfig } from './usePartConfig.svelte';
 import { useResourceByName } from './useResourceByName.svelte';
 const key = Symbol('frames-context');

package/dist/hooks/useGeometries.svelte.js

@@ -7,9 +7,9 @@ import { resourceColors } from '../color';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { hierarchy, traits, useWorld } from '../ecs';
 import { updateGeometryTrait } from '../ecs/traits';
+import { useLogs } from '../plugins';
 import { createPose, poseToMatrix } from '../transform';
 import { useEnvironment } from './useEnvironment.svelte';
-import { useLogs } from './useLogs.svelte';
 import { useResourceByName } from './useResourceByName.svelte';
 import { RefreshRates, useSettings } from './useSettings.svelte';
 const key = Symbol('geometries-context');

package/dist/hooks/usePointcloudObjects.svelte.js

@@ -6,9 +6,9 @@ import { ColorFormat } from '../buf/draw/v1/metadata_pb';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { hierarchy, traits, useWorld } from '../ecs';
 import { parsePcdInWorker } from '../lib';
+import { useLogs } from '../plugins';
 import { createPose } from '../transform';
 import { useEnvironment } from './useEnvironment.svelte';
-import { useLogs } from './useLogs.svelte';
 import { RefreshRates, useSettings } from './useSettings.svelte';
 const key = Symbol('pointcloud-object-context');
 export const providePointcloudObjects = (partID) => {

package/dist/hooks/usePointclouds.svelte.js

@@ -6,8 +6,8 @@ import { ColorFormat } from '../buf/draw/v1/metadata_pb';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
 import { hierarchy, traits, useWorld } from '../ecs';
 import { parsePcdInWorker } from '../loaders/pcd';
+import { useLogs } from '../plugins';
 import { useEnvironment } from './useEnvironment.svelte';
-import { useLogs } from './useLogs.svelte';
 import { RefreshRates, useSettings } from './useSettings.svelte';
 const key = Symbol('pointcloud-context');
 export const providePointclouds = (partID) => {

package/dist/hooks/usePose.svelte.js

@@ -2,9 +2,9 @@ import { commonApi, MachineConnectionEvent, Pose } from '@viamrobotics/sdk';
 import { createRobotQuery, useConnectionStatus, useRobotClient } from '@viamrobotics/svelte-sdk';
 import { untrack } from 'svelte';
 import { RefetchRates } from '../components/overlay/RefreshRate.svelte';
+import { useLogs } from '../plugins';
 import { useEnvironment } from './useEnvironment.svelte';
 import { useFrames } from './useFrames.svelte';
-import { useLogs } from './useLogs.svelte';
 import { usePartID } from './usePartID.svelte';
 import { useRefetchPoses } from './useRefetchPoses';
 import { useResourceByName } from './useResourceByName.svelte';

package/dist/plugins/DrawService/useDrawAPI.svelte.js

@@ -11,7 +11,7 @@ import { asRGB, STRIDE } from '../../buffer';
 import { hierarchy, traits, useWorld } from '../../ecs';
 import { createBox, createCapsule, createSphere } from '../../geometry';
 import { useCameraControls } from '../../hooks/useControls.svelte';
-import { useLogs } from '../../hooks/useLogs.svelte';
+import { useLogs } from '..';
 import { parsePlyInput } from '../../ply';
 import { createPose, createPoseFromFrame, poseToMatrix } from '../../transform';
 import { useDrawConnectionConfig } from './useDrawConnectionConfig.svelte';

package/dist/plugins/Logs/Logs.svelte

@@ -0,0 +1,146 @@
+<script lang="ts">
+	import { Portal } from '@threlte/extras'
+	import { PersistedState } from 'runed'
+
+	import DashboardButton from '../../components/overlay/dashboard/Button.svelte'
+	import FloatingPanel from '../../components/overlay/FloatingPanel.svelte'
+
+	import { provideLogs } from './useLogs.svelte'
+
+	const logs = provideLogs()
+
+	const isOpen = new PersistedState('logs-is-open', false)
+
+	let levels = new PersistedState('logs-selected-levels', {
+		info: true,
+		warn: true,
+		error: true,
+	})
+</script>
+
+<Portal id="dashboard">
+	<fieldset class="relative">
+		<DashboardButton
+			active={isOpen.current}
+			icon="article"
+			description="Logs"
+			onclick={() => {
+				isOpen.current = !isOpen.current
+			}}
+		/>
+		{#if logs.warnings.length > 0}
+			<span
+				class="absolute z-4 -mt-1.5 -ml-1.5 h-4 w-4 rounded-full bg-yellow-700 text-center text-[10px] text-white"
+			>
+				{logs.warnings.length}
+			</span>
+		{/if}
+
+		{#if logs.errors.length > 0}
+			<span
+				class="absolute z-4 -mt-1.5 -ml-1.5 h-4 rounded-full bg-red-700 px-1.25 text-center text-[10px] text-white"
+			>
+				{logs.errors.length}
+			</span>
+		{/if}
+	</fieldset>
+</Portal>
+
+<Portal id="dom">
+	<FloatingPanel
+		title="Logs"
+		bind:isOpen={isOpen.current}
+		defaultSize={{ width: 240, height: 315 }}
+		resizable
+	>
+		<div class="flex h-full flex-col">
+			<div class="flex gap-1 px-3 py-2">
+				<button
+					type="button"
+					class={[
+						'chip border px-2',
+						{
+							'border-danger-dark bg-danger-dark text-white hover:border-red-700 hover:bg-red-700':
+								levels.current.error,
+							'bg-light hover:bg-ghost-light hover:border-light border-light text-subtle-1':
+								!levels.current.error,
+						},
+					]}
+					onclick={() => {
+						levels.current.error = !levels.current.error
+					}}
+				>
+					error
+				</button>
+
+				<button
+					type="button"
+					class={[
+						'chip border',
+						{
+							'border-amber-400 bg-amber-400 text-white hover:border-amber-500 hover:bg-amber-500':
+								levels.current.warn,
+							'bg-light hover:bg-ghost-light hover:border-light border-light text-subtle-1':
+								!levels.current.warn,
+						},
+					]}
+					onclick={() => {
+						levels.current.warn = !levels.current.warn
+					}}
+				>
+					warn
+				</button>
+
+				<button
+					type="button"
+					class={[
+						'chip border',
+						{
+							'border-blue-400 bg-blue-400 text-white hover:border-blue-500 hover:bg-blue-500':
+								levels.current.info,
+							'bg-light hover:bg-ghost-light hover:border-light border-light text-subtle-1':
+								!levels.current.info,
+						},
+					]}
+					onclick={() => {
+						levels.current.info = !levels.current.info
+					}}
+				>
+					info
+				</button>
+			</div>
+
+			<div class="flex flex-col gap-2 overflow-auto px-3 pb-3 text-xs">
+				{#each logs.current as log (log.uuid)}
+					{#if levels.current[log.level]}
+						<div>
+							<div class="flex flex-wrap items-center gap-1.5">
+								<div
+									class={[
+										'h-2 w-2 rounded-full',
+										{
+											'bg-danger-dark': log.level === 'error',
+											'bg-amber-300': log.level === 'warn',
+											'bg-blue-400': log.level === 'info',
+										},
+									]}
+								></div>
+								<div class="text-subtle-2">{log.timestamp}</div>
+							</div>
+							<div>
+								{#if log.count > 1}
+									<span class="mr-1 rounded bg-green-700 px-1 py-0.5 text-xs text-white">
+										{log.count}
+									</span>
+								{/if}
+								{log.message}
+							</div>
+						</div>
+					{/if}
+				{:else}
+					No logs
+				{/each}
+			</div>
+		</div>
+	</FloatingPanel>
+</Portal>

package/dist/{hooks → plugins/Logs}/useLogs.svelte.d.ts

@@ -12,6 +12,6 @@ interface Context {
     warnings: Log[];
     add(message: string, level?: Level): void;
 }
-export declare const provideLogs: () => void;
+export declare const provideLogs: () => Context;
 export declare const useLogs: () => Context;
 export {};

package/dist/{hooks → plugins/Logs}/useLogs.svelte.js

@@ -1,7 +1,8 @@
-import { getContext, setContext, untrack } from 'svelte';
+import { untrack } from 'svelte';
 import { MathUtils } from 'three';
-const key = Symbol('logs-context');
 const MAX_LOGS = 200;
+// Logs is a singleton. We only have one logger per app and we need to access it anywhere.
+let context;
 export const provideLogs = () => {
     // Plain insertion-ordered Map keyed by `${level}|${timestamp}|${message}`
     // drives storage; a single `$state` version counter drives reactivity.
@@ -23,7 +24,7 @@ export const provideLogs = () => {
     });
     const errors = $derived(all.filter((l) => l.level === 'error'));
     const warnings = $derived(all.filter((l) => l.level === 'warn'));
-    setContext(key, {
+    context = {
         get current() {
             return all;
         },
@@ -58,8 +59,15 @@ export const provideLogs = () => {
                 version++;
             });
         },
-    });
+    };
+    return context;
 };
 export const useLogs = () => {
-    return getContext(key);
+    // return a no-op context if the plugin isn't installed
+    return (context ?? {
+        current: [],
+        errors: [],
+        warnings: [],
+        add: () => undefined,
+    });
 };

package/dist/plugins/index.d.ts

@@ -6,6 +6,8 @@ export { default as MeasureTool } from './MeasureTool/MeasureTool.svelte';
 export { default as DrawService } from './DrawService/DrawService.svelte';
 export { default as Skybox } from './Skybox/Skybox.svelte';
 export { default as Debug } from './Debug/Debug.svelte';
+export { default as Logs } from './Logs/Logs.svelte';
+export { useLogs } from './Logs/useLogs.svelte';
 export { default as Focus } from './Focus/Focus.svelte';
 export { default as LLMSceneBuilder } from './LLMSceneBuilder/LLMSceneBuilder.svelte';
 export type { InferCallback, ComponentFrameInfo } from './LLMSceneBuilder/useSceneBuilder.svelte';

package/dist/plugins/index.js

@@ -10,8 +10,13 @@ export { default as DrawService } from './DrawService/DrawService.svelte';
 export { default as Skybox } from './Skybox/Skybox.svelte';
 // Debug
 export { default as Debug } from './Debug/Debug.svelte';
+// Logs
+export { default as Logs } from './Logs/Logs.svelte';
+export { useLogs } from './Logs/useLogs.svelte';
+// Focus
 export { default as Focus } from './Focus/Focus.svelte';
 // LLMSceneBuilder
 export { default as LLMSceneBuilder } from './LLMSceneBuilder/LLMSceneBuilder.svelte';
+// XR
 export { default as XR } from './XR/XR.svelte';
 export { default as XRSettings } from './XR/XRSettings.svelte';

package/package.json

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

package/dist/components/overlay/Logs.svelte

@@ -1,144 +0,0 @@
-<script lang="ts">
-	import { Portal } from '@threlte/extras'
-	import { PersistedState } from 'runed'
-
-	import { useLogs } from '../../hooks/useLogs.svelte'
-
-	import DashboardButton from './dashboard/Button.svelte'
-	import FloatingPanel from './FloatingPanel.svelte'
-
-	const logs = useLogs()
-
-	const isOpen = new PersistedState('logs-is-open', false)
-
-	let levels = new PersistedState('logs-selected-levels', {
-		info: true,
-		warn: true,
-		error: true,
-	})
-</script>
-
-<Portal id="dashboard">
-	<fieldset class="relative">
-		<DashboardButton
-			active={isOpen.current}
-			icon="article"
-			description="Logs"
-			onclick={() => {
-				isOpen.current = !isOpen.current
-			}}
-		/>
-		{#if logs.warnings.length > 0}
-			<span
-				class="absolute z-4 -mt-1.5 -ml-1.5 h-4 w-4 rounded-full bg-yellow-700 text-center text-[10px] text-white"
-			>
-				{logs.warnings.length}
-			</span>
-		{/if}
-
-		{#if logs.errors.length > 0}
-			<span
-				class="absolute z-4 -mt-1.5 -ml-1.5 h-4 rounded-full bg-red-700 px-1.25 text-center text-[10px] text-white"
-			>
-				{logs.errors.length}
-			</span>
-		{/if}
-	</fieldset>
-</Portal>
-
-<FloatingPanel
-	title="Logs"
-	bind:isOpen={isOpen.current}
-	defaultSize={{ width: 240, height: 315 }}
-	resizable
->
-	<div class="flex h-full flex-col">
-		<div class="flex gap-1 px-3 py-2">
-			<button
-				type="button"
-				class={[
-					'chip border px-2',
-					{
-						'border-danger-dark bg-danger-dark text-white hover:border-red-700 hover:bg-red-700':
-							levels.current.error,
-						'bg-light hover:bg-ghost-light hover:border-light border-light text-subtle-1':
-							!levels.current.error,
-					},
-				]}
-				onclick={() => {
-					levels.current.error = !levels.current.error
-				}}
-			>
-				error
-			</button>
-
-			<button
-				type="button"
-				class={[
-					'chip border',
-					{
-						'border-amber-400 bg-amber-400 text-white hover:border-amber-500 hover:bg-amber-500':
-							levels.current.warn,
-						'bg-light hover:bg-ghost-light hover:border-light border-light text-subtle-1':
-							!levels.current.warn,
-					},
-				]}
-				onclick={() => {
-					levels.current.warn = !levels.current.warn
-				}}
-			>
-				warn
-			</button>
-
-			<button
-				type="button"
-				class={[
-					'chip border',
-					{
-						'border-blue-400 bg-blue-400 text-white hover:border-blue-500 hover:bg-blue-500':
-							levels.current.info,
-						'bg-light hover:bg-ghost-light hover:border-light border-light text-subtle-1':
-							!levels.current.info,
-					},
-				]}
-				onclick={() => {
-					levels.current.info = !levels.current.info
-				}}
-			>
-				info
-			</button>
-		</div>
-
-		<div class="flex flex-col gap-2 overflow-auto px-3 pb-3 text-xs">
-			{#each logs.current as log (log.uuid)}
-				{#if levels.current[log.level]}
-					<div>
-						<div class="flex flex-wrap items-center gap-1.5">
-							<div
-								class={[
-									'h-2 w-2 rounded-full',
-									{
-										'bg-danger-dark': log.level === 'error',
-										'bg-amber-300': log.level === 'warn',
-										'bg-blue-400': log.level === 'info',
-									},
-								]}
-							></div>
-							<div class="text-subtle-2">{log.timestamp}</div>
-						</div>
-						<div>
-							{#if log.count > 1}
-								<span class="mr-1 rounded bg-green-700 px-1 py-0.5 text-xs text-white">
-									{log.count}
-								</span>
-							{/if}
-							{log.message}
-						</div>
-					</div>
-				{/if}
-			{:else}
-				No logs
-			{/each}
-		</div>
-	</div>
-</FloatingPanel>