@viamrobotics/test-widgets 0.9.1 → 0.10.0

package/dist/components/audio-properties.svelte.d.ts

@@ -0,0 +1,8 @@
+interface Props {
+    supportedCodecs: string[];
+    sampleRateHz: number;
+    numChannels: number;
+}
+declare const AudioProperties: import("svelte").Component<Props, {}, "">;
+type AudioProperties = ReturnType<typeof AudioProperties>;
+export default AudioProperties;

package/dist/components/navigation-map/lib/create-geometry.js

@@ -1,7 +1,5 @@
-import { ViamObject3D } from '@viamrobotics/three';
 export const createGeometry = (type, size = 5, rotation = 0) => {
-    const pose = new ViamObject3D();
-    pose.orientationVector.th = rotation;
+    const pose = { orientationVector: { th: rotation } };
     switch (type) {
         case 'box': {
             return {

package/dist/components/navigation-map/types.d.ts

@@ -1,7 +1,13 @@
-import type { ViamObject3D } from '@viamrobotics/three';
 import type { LngLat } from 'maplibre-gl';
+/** Client-side pose for a navigation-map geometry. Rotation only; never serialized. */
+export interface GeometryPose {
+    /** Orientation vector; only the theta rotation (radians) is used on the map. */
+    orientationVector: {
+        th: number;
+    };
+}
 interface BaseGeometry {
-    pose: ViamObject3D;
+    pose: GeometryPose;
 }
 export declare const NavigationTab: {
     readonly Waypoints: "Waypoints";

package/dist/components/{widgets/motion/pose-input.svelte → pose-editor.svelte}

@@ -16,23 +16,26 @@
 </script>
 
 <script lang="ts">
-	import { Button, Icon, NumericInput, Tooltip } from '@viamrobotics/prime-core'
+	import { Icon, NumericInput, Tooltip } from '@viamrobotics/prime-core'
 
-	import AngleUnitToggle from '../../angle-unit-toggle.svelte'
-	import CopyButton from '../../copy-button.svelte'
-	import PasteButton from '../../paste-button.svelte'
-	import Table from '../../table.svelte'
-	import { numberValueFromEvent } from '../../../event-handlers'
-	import { degreesToRadians, formatNumeric, radiansToDegrees } from '../../../format'
-
-	import { parsePastedPose } from './parse-pasted-pose'
+	import AngleUnitToggle from './angle-unit-toggle.svelte'
+	import CopyButton from './copy-button.svelte'
+	import PasteButton from './paste-button.svelte'
+	import Table from './table.svelte'
+	import { numberValueFromEvent } from '../event-handlers'
+	import { degreesToRadians, formatNumeric, radiansToDegrees } from '../format'
+	import { parsePastedPose } from '../parse-pasted-pose'
 
 	interface Props {
 		pose: Pose
 		onPoseChange: (pose: Pose) => void
+		/** Heading shown above the input table. */
+		title: string
+		/** Optional info-tooltip text shown next to the title. */
+		description?: string
 	}
 
-	const { pose, onPoseChange }: Props = $props()
+	const { pose, onPoseChange, title, description }: Props = $props()
 
 	let useRadians = $state(false)
 
@@ -41,6 +44,8 @@
 		theta: useRadians ? degreesToRadians(pose.theta) : pose.theta,
 	})
 
+	// Copy the stored pose (theta in degrees) so it round-trips through paste
+	// regardless of the display unit currently selected.
 	const copyData = $derived(JSON.stringify(pose))
 
 	const handlePaste = (data: string): boolean => {
@@ -57,10 +62,6 @@
 		onPoseChange({ ...pose, [key]: nextValue })
 	}
 
-	const zero = () => {
-		onPoseChange({ x: 0, y: 0, z: 0, oX: 0, oY: 0, oZ: 1, theta: 0 })
-	}
-
 	const poseUnits = $derived({
 		x: 'mm',
 		y: 'mm',
@@ -75,18 +76,17 @@
 <div class="flex min-w-0 flex-col gap-4">
 	<div class="flex items-center justify-between">
 		<span class="flex flex-row items-center gap-1 text-sm">
-			Destination pose
-			<Tooltip>
-				<Icon
-					name="information-outline"
-					cx="text-gray-6"
-				/>
-
-				<span slot="description">
-					The target pose expressed in the selected reference frame. Translations are in
-					millimeters.
-				</span>
-			</Tooltip>
+			{title}
+			{#if description}
+				<Tooltip>
+					<Icon
+						name="information-outline"
+						cx="text-gray-6"
+					/>
+
+					<span slot="description">{description}</span>
+				</Tooltip>
+			{/if}
 		</span>
 		<div class="flex gap-1">
 			<AngleUnitToggle
@@ -131,24 +131,4 @@
 			{/each}
 		</tbody>
 	</Table>
-
-	<div class="flex flex-col gap-2">
-		<span class="flex flex-row gap-2">
-			<h4 class="text-xs font-semibold">Quick set</h4>
-			<Tooltip>
-				<Icon
-					name="information-outline"
-					cx="text-gray-6"
-				/>
-
-				<span slot="description"> Will update the pose values but will not execute </span>
-			</Tooltip>
-		</span>
-		<Button
-			class="w-fit"
-			onclick={zero}
-		>
-			Zero
-		</Button>
-	</div>
 </div>

package/dist/components/pose-editor.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Pose } from '@viamrobotics/sdk';
+interface Props {
+    pose: Pose;
+    onPoseChange: (pose: Pose) => void;
+    /** Heading shown above the input table. */
+    title: string;
+    /** Optional info-tooltip text shown next to the title. */
+    description?: string;
+}
+declare const PoseEditor: import("svelte").Component<Props, {}, "">;
+type PoseEditor = ReturnType<typeof PoseEditor>;
+export default PoseEditor;

package/dist/components/widgets/arm/move-to-position.svelte

@@ -1,15 +1,10 @@
 <script lang="ts">
 	import type { Pose } from '@viamrobotics/sdk'
 
-	import { Button, Icon, NumericInput, Tooltip } from '@viamrobotics/prime-core'
+	import { Button, Icon, Tooltip } from '@viamrobotics/prime-core'
 
-	import AngleUnitToggle from '../../angle-unit-toggle.svelte'
-	import CopyButton from '../../copy-button.svelte'
 	import ErrorDisplay from '../../error.svelte'
-	import PasteButton from '../../paste-button.svelte'
-	import Table from '../../table.svelte'
-	import { numberValueFromEvent } from '../../../event-handlers'
-	import { degreesToRadians, formatNumeric, radiansToDegrees } from '../../../format'
+	import PoseEditor from '../../pose-editor.svelte'
 
 	interface Props {
 		endPosition: Pose
@@ -21,7 +16,6 @@
 
 	// svelte-ignore state_referenced_locally
 	let desiredPosition = $state({ ...endPosition })
-	let useRadians = $state(false)
 
 	const resetToZero = () => {
 		desiredPosition = {
@@ -38,118 +32,17 @@
 	const resetToCurrent = () => {
 		desiredPosition = { ...endPosition }
 	}
-
-	const displayPosition = $derived({
-		x: desiredPosition.x,
-		y: desiredPosition.y,
-		z: desiredPosition.z,
-		oX: desiredPosition.oX,
-		oY: desiredPosition.oY,
-		oZ: desiredPosition.oZ,
-		theta: useRadians ? degreesToRadians(desiredPosition.theta) : desiredPosition.theta,
-	})
-
-	const copyData = $derived(JSON.stringify(displayPosition))
-	const handlePaste = (data: string): boolean => {
-		try {
-			desiredPosition = JSON.parse(data) as Pose
-		} catch {
-			return false
-		}
-		return true
-	}
-
-	const handleAngleInputChange = (key: keyof Pose, inputValue: number) => {
-		if (key === 'theta') {
-			desiredPosition[key] = useRadians ? radiansToDegrees(inputValue) : inputValue
-		} else {
-			desiredPosition[key] = inputValue
-		}
-	}
-
-	const positionLabels: Record<keyof Pose, string> = {
-		x: 'X',
-		y: 'Y',
-		z: 'Z',
-		oX: 'OX',
-		oY: 'OY',
-		oZ: 'OZ',
-		theta: 'θ',
-	} as const
-	const positionUnits = $derived({
-		x: 'mm',
-		y: 'mm',
-		z: 'mm',
-		oX: '',
-		oY: '',
-		oZ: '',
-		theta: useRadians ? 'rad' : 'deg',
-	} as const satisfies Record<keyof Pose, string>)
-
-	const positionLabelsList = Object.entries(positionLabels) as [keyof Pose, string][]
 </script>
 
 <div class="flex min-w-0 flex-col gap-4">
-	<!-- Controls Header -->
-	<div class="flex items-center justify-between">
-		<span class="flex flex-row items-center gap-1 text-sm">
-			Pose Values
-			<Tooltip>
-				<Icon
-					name="information-outline"
-					cx="text-gray-6"
-				/>
-
-				<span slot="description">
-					Pose is with respect to the arm origin and does not take into account the motion service
-					or frame system.
-				</span>
-			</Tooltip>
-		</span>
-		<div class="flex gap-1">
-			<AngleUnitToggle
-				{useRadians}
-				onToggle={() => {
-					useRadians = !useRadians
-				}}
-			/>
-			<CopyButton data={copyData} />
-			<PasteButton onPaste={handlePaste} />
-		</div>
-	</div>
-
-	<Table>
-		<thead>
-			<tr>
-				<th>Pose</th>
-				<th>Value</th>
-			</tr>
-		</thead>
-		<tbody>
-			{#each positionLabelsList as labelList (labelList)}
-				{@const [key, label] = labelList}
-				{@const value = Number.parseFloat(formatNumeric(displayPosition[key]))}
-				<tr>
-					<th>
-						<span class="relative inline-flex justify-center">
-							{label}
-							<abbr class="text-subtle-2 absolute left-full ml-1">{positionUnits[key]}</abbr>
-						</span>
-					</th>
-					<th>
-						<NumericInput
-							cx="max-w-[76px]"
-							{value}
-							on:change={(event) => {
-								const inputValue = numberValueFromEvent(event) ?? 0
-								handleAngleInputChange(key, inputValue)
-							}}
-						/>
-					</th>
-				</tr>
-			{/each}
-		</tbody>
-	</Table>
+	<PoseEditor
+		pose={desiredPosition}
+		onPoseChange={(next) => {
+			desiredPosition = next
+		}}
+		title="Pose Values"
+		description="Pose is with respect to the arm origin and does not take into account the motion service or frame system."
+	/>
 
 	<div class="mb-2 flex flex-col gap-2">
 		<span class="flex flex-row gap-2">

package/dist/components/widgets/audio-input/audio-input.svelte

@@ -4,6 +4,7 @@
 	import { createResourceClient, createResourceQuery } from '@viamrobotics/svelte-sdk'
 
 	import ApiSection from '../../api-section.svelte'
+	import Properties from '../../audio-properties.svelte'
 	import ConnectionStatus from '../../connection-status.svelte'
 	import MutationSection from '../../mutation-section.svelte'
 	import Query from '../../query.svelte'
@@ -12,7 +13,6 @@
 	import { numberValueFromEvent } from '../../../event-handlers'
 
 	import { createAudioCapturer } from './create-audio-capturer.svelte.js'
-	import Properties from './properties.svelte'
 
 	interface Props {
 		partID: string

package/dist/components/widgets/audio-input/get-properties-widget.svelte

@@ -3,10 +3,9 @@
 	import { createResourceClient, createResourceQuery } from '@viamrobotics/svelte-sdk'
 
 	import ApiSection from '../../api-section.svelte'
+	import Properties from '../../audio-properties.svelte'
 	import Query from '../../query.svelte'
 
-	import Properties from './properties.svelte'
-
 	interface Props {
 		partID: string
 		resourceName: string

package/dist/components/widgets/audio-output/audio-output.svelte

@@ -4,6 +4,7 @@
 	import { createResourceClient, createResourceQuery } from '@viamrobotics/svelte-sdk'
 
 	import ApiSection from '../../api-section.svelte'
+	import Properties from '../../audio-properties.svelte'
 	import ConnectionStatus from '../../connection-status.svelte'
 	import MutationSection from '../../mutation-section.svelte'
 	import Query from '../../query.svelte'
@@ -13,7 +14,6 @@
 
 	import { ExtToCodec, MimeToCodec } from './codec.js'
 	import { createAudioPlayer } from './create-audio-player.svelte.js'
-	import Properties from './properties.svelte'
 
 	interface Props {
 		partID: string

package/dist/components/widgets/audio-output/get-properties-widget.svelte

@@ -3,10 +3,9 @@
 	import { createResourceClient, createResourceQuery } from '@viamrobotics/svelte-sdk'
 
 	import ApiSection from '../../api-section.svelte'
+	import Properties from '../../audio-properties.svelte'
 	import Query from '../../query.svelte'
 
-	import Properties from './properties.svelte'
-
 	interface Props {
 		partID: string
 		resourceName: string

package/dist/components/widgets/camera/camera.svelte

@@ -3,6 +3,7 @@
 	import { Button, Label, Select, Switch, ToggleButtons } from '@viamrobotics/prime-core'
 	import { CameraClient } from '@viamrobotics/sdk'
 	import { createResourceClient, createResourceQuery } from '@viamrobotics/svelte-sdk'
+	import { PersistedState } from 'runed'
 
 	import { useAddImageToDataset } from '../../../add-image-to-dataset'
 	import ConnectionStatus from '../../connection-status.svelte'
@@ -37,14 +38,12 @@
 		() => resourceName,
 		'camera'
 	)
-	let isPlaying = $state(false)
-	$effect(() => {
-		// Reset the play gate whenever the camera identity changes so a swapped
-		// resource doesn't auto-start using the previous instance's state.
-		void resourceName
-		void partID
-		isPlaying = false
-	})
+
+	const waitToStartFeed = $derived(
+		new PersistedState(`camera-wait-to-start-feed/${partID}/${resourceName}`, false)
+	)
+
+	let isPlaying = $derived(!waitToStartFeed.current)
 	let isShowingPointcloud = $state(false)
 	let selectedSource = $state('')
 	let sourceNames = $state<string[]>([])
@@ -168,6 +167,19 @@
 					headingId={getImagesHeadingID}
 				/>
 			</div>
+			<div class="flex gap-4 px-4 pt-3">
+				<Label position="left">
+					Wait to start feed
+					<Switch
+						slot="input"
+						annotated
+						on={waitToStartFeed.current}
+						on:change={(event) => {
+							waitToStartFeed.current = event.detail
+						}}
+					/>
+				</Label>
+			</div>
 			{#if isPlaying}
 				<div class="flex gap-4 p-4 pb-3">
 					<RefetchController

package/dist/components/widgets/gantry/move-to-position.svelte

@@ -4,6 +4,7 @@
 
 	import ErrorDisplay from '../../error.svelte'
 	import Table from '../../table.svelte'
+	import { numberValueFromEvent } from '../../../event-handlers'
 
 	import { matchArrayLength } from './match-array-length'
 
@@ -36,12 +37,16 @@
 	})
 
 	const onChangePos = (index: number, event: Event) => {
-		const target = event.target as HTMLInputElement
-		desiredPositions[index] = target.valueAsNumber
+		const value = numberValueFromEvent(event)
+		if (value !== undefined) {
+			desiredPositions[index] = value
+		}
 	}
 	const onChangeSpeed = (index: number, event: Event) => {
-		const target = event.target as HTMLInputElement
-		desiredSpeeds[index] = target.valueAsNumber
+		const value = numberValueFromEvent(event)
+		if (value !== undefined) {
+			desiredSpeeds[index] = value
+		}
 	}
 	const resetToZero = () => {
 		desiredSpeeds = matchArrayLength([], positions, 50)

package/dist/components/widgets/motion/motion.svelte

@@ -43,6 +43,8 @@
 					options={frameNames}
 					onChange={(value) => {
 						selectedFrame = value
+						// reset the destination to the newly selected frame's parent
+						selectedDestination = undefined
 					}}
 				/>
 				<FrameSelect

package/dist/components/widgets/motion/move.svelte

@@ -1,16 +1,15 @@
 <script lang="ts">
 	import type { Pose } from '@viamrobotics/sdk'
 
-	import { Button, Progress } from '@viamrobotics/prime-core'
+	import { Button, Icon, Progress, Tooltip } from '@viamrobotics/prime-core'
 	import { CodeEditor } from '@viamrobotics/prime-core/code-editor'
 	import { PersistedState } from 'runed'
 
 	import ErrorDisplay from '../../error.svelte'
+	import PoseEditor from '../../pose-editor.svelte'
 
 	import type { MoveInput } from './parse-move-args'
 
-	import PoseInput from './pose-input.svelte'
-
 	interface Props {
 		/** The frame being moved. Gates execution and re-seeds the editor on change. */
 		frameName: string
@@ -56,13 +55,37 @@
 </script>
 
 <div class="flex min-w-0 flex-col gap-4">
-	<PoseInput
+	<PoseEditor
 		{pose}
 		onPoseChange={(next) => {
 			edit = { key: editKey, pose: next }
 		}}
+		title="Destination pose"
+		description="The target pose expressed in the selected reference frame. Translations are in millimeters."
 	/>
 
+	<div class="flex flex-col gap-2">
+		<span class="flex flex-row gap-2">
+			<h4 class="text-xs font-semibold">Quick set</h4>
+			<Tooltip>
+				<Icon
+					name="information-outline"
+					cx="text-gray-6"
+				/>
+
+				<span slot="description"> Will update the pose values but will not execute </span>
+			</Tooltip>
+		</span>
+		<Button
+			class="w-fit"
+			onclick={() => {
+				edit = { key: editKey, pose: zeroPose }
+			}}
+		>
+			Zero
+		</Button>
+	</div>
+
 	<div class="flex flex-col gap-1">
 		<span class="text-xs font-medium">
 			World state <abbr class="text-subtle-2">(optional JSON)</abbr>

package/dist/components/widgets/pcd/inputs.svelte

@@ -3,6 +3,8 @@
 
 	import { Label, NumericInput, Select } from '@viamrobotics/prime-core'
 
+	import { numberValueFromEvent } from '../../../event-handlers'
+
 	import Download from './download.svelte'
 
 	interface Props {
@@ -25,8 +27,9 @@
 	] as const
 
 	const handlePointSizeChange = (event: Event) => {
-		if (event.target instanceof HTMLInputElement) {
-			onPointSizeChange(event.target.valueAsNumber)
+		const value = numberValueFromEvent(event)
+		if (value !== undefined) {
+			onPointSizeChange(value)
 		}
 	}
 

package/dist/{components/widgets/motion/parse-pasted-pose.d.ts → parse-pasted-pose.d.ts}

@@ -1,8 +1,8 @@
 import type { Pose } from '@viamrobotics/sdk';
 /**
  * Parses a clipboard string as a pose. Accepts a JSON object with numeric
- * `x`, `y`, `z`, `oX`, `oY`, `oZ`, and `theta` fields — the same shape the arm
- * `MoveToPosition` widget copies, so poses can be pasted between the two.
+ * `x`, `y`, `z`, `oX`, `oY`, `oZ`, and `theta` fields — the same shape the pose
+ * editor copies, so poses can be pasted between any widget that edits one.
  *
  * @param data - The pasted string.
  * @returns The parsed pose, or `undefined` if it is not a valid pose.

package/dist/{components/widgets/motion/parse-pasted-pose.js → parse-pasted-pose.js}

@@ -8,8 +8,8 @@ const isPose = (value) => {
 };
 /**
  * Parses a clipboard string as a pose. Accepts a JSON object with numeric
- * `x`, `y`, `z`, `oX`, `oY`, `oZ`, and `theta` fields — the same shape the arm
- * `MoveToPosition` widget copies, so poses can be pasted between the two.
+ * `x`, `y`, `z`, `oX`, `oY`, `oZ`, and `theta` fields — the same shape the pose
+ * editor copies, so poses can be pasted between any widget that edits one.
  *
  * @param data - The pasted string.
  * @returns The parsed pose, or `undefined` if it is not a valid pose.

package/package.json

@@ -1,8 +1,165 @@
 {
   "name": "@viamrobotics/test-widgets",
-  "version": "0.9.1",
+  "version": "0.10.0",
   "license": "Apache-2.0",
   "type": "module",
+  "wireit": {
+    "build": {
+      "dependencies": [
+        "vite-build",
+        "package"
+      ]
+    },
+    "package": {
+      "command": "svelte-package && publint",
+      "files": [
+        "src/lib/**",
+        "svelte.config.js",
+        "tsconfig.json",
+        "package.json"
+      ],
+      "output": [
+        "dist/**"
+      ],
+      "dependencies": [
+        "svelte-sync"
+      ],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "vite-build": {
+      "command": "vite build",
+      "files": [
+        "src/**",
+        "static/**",
+        ".env",
+        ".env.*",
+        "vite.config.ts",
+        "svelte.config.js",
+        "postcss.config.js",
+        "tsconfig.json",
+        "package.json"
+      ],
+      "output": [
+        "build/**",
+        ".svelte-kit/output/**"
+      ],
+      "dependencies": [
+        "svelte-sync",
+        "package"
+      ],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "svelte-sync": {
+      "command": "svelte-kit sync",
+      "files": [
+        "svelte.config.js",
+        "src/**",
+        "tsconfig.json",
+        "package.json"
+      ],
+      "output": [
+        ".svelte-kit/generated/**",
+        ".svelte-kit/types/**",
+        ".svelte-kit/ambient.d.ts",
+        ".svelte-kit/non-ambient.d.ts",
+        ".svelte-kit/tsconfig.json"
+      ],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "prepack": {
+      "dependencies": [
+        "package"
+      ]
+    },
+    "check": {
+      "command": "svelte-check --tsconfig ./tsconfig.json --fail-on-warnings",
+      "files": [
+        "src/**",
+        "tsconfig.json",
+        "svelte.config.js",
+        "package.json"
+      ],
+      "output": [],
+      "dependencies": [
+        "svelte-sync"
+      ],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "lint": {
+      "command": "eslint . --concurrency auto",
+      "files": [
+        "**",
+        "!build/**",
+        "!dist/**",
+        "!.svelte-kit/**",
+        "!coverage/**",
+        "!test-results/**",
+        "!.env*",
+        "!**/*.tgz"
+      ],
+      "output": [],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "format": {
+      "command": "prettier --check .",
+      "files": [
+        "**",
+        "!build/**",
+        "!dist/**",
+        "!.svelte-kit/**",
+        "!coverage/**",
+        "!test-results/**",
+        "!.env*",
+        "!**/*.tgz"
+      ],
+      "output": [],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "test": {
+      "command": "vitest --run",
+      "files": [
+        "src/**",
+        "vite.config.ts",
+        "svelte.config.js",
+        "postcss.config.js",
+        "tsconfig.json",
+        "package.json"
+      ],
+      "output": [],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    },
+    "test:coverage": {
+      "command": "vitest run --coverage",
+      "files": [
+        "src/**",
+        "vite.config.ts",
+        "svelte.config.js",
+        "postcss.config.js",
+        "tsconfig.json",
+        "package.json"
+      ],
+      "output": [
+        "coverage/**"
+      ],
+      "packageLocks": [
+        "pnpm-lock.yaml"
+      ]
+    }
+  },
   "files": [
     "dist",
     "!dist/**/*.test.*",
@@ -37,7 +194,6 @@
     "@viamrobotics/prime-core": ">=0.1",
     "@viamrobotics/sdk": ">=0.68",
     "@viamrobotics/svelte-sdk": ">=1.1",
-    "@viamrobotics/three": ">=0.0.9",
     "lodash-es": ">=4",
     "maplibre-gl": ">=5",
     "runed": ">=0.28",
@@ -46,9 +202,6 @@
     "threlte-uikit": ">=2"
   },
   "peerDependenciesMeta": {
-    "@viamrobotics/three": {
-      "optional": true
-    },
     "maplibre-gl": {
       "optional": true
     }
@@ -87,8 +240,7 @@
     "@viamrobotics/sdk": "^0.69.0",
     "@viamrobotics/svelte-sdk": "^1.2.1",
     "@viamrobotics/tailwind-config": "^1.0.0",
-    "@viamrobotics/three": "^0.0.9",
-    "@vitest/browser": "^4.1.8",
+    "@vitest/browser": "^4.1.10",
     "@vitest/browser-playwright": "^4.1.5",
     "@vitest/coverage-v8": "^4.1.5",
     "@zag-js/dialog": "^1.37.0",
@@ -121,7 +273,8 @@
     "vite-plugin-devtools-json": "^1.0.0",
     "vite-plugin-glsl": "^1.6.0",
     "vitest": "^4.1.5",
-    "vitest-browser-svelte": "^2.1.1"
+    "vitest-browser-svelte": "^2.1.1",
+    "wireit": "^0.14.13"
   },
   "engines": {
     "node": ">=22.12.0"
@@ -131,16 +284,20 @@
   },
   "scripts": {
     "dev": "vite dev",
-    "build": "vite build && pnpm prepack",
+    "build": "wireit",
+    "vite-build": "wireit",
+    "package": "wireit",
+    "svelte-sync": "wireit",
     "preview": "vite preview",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --fail-on-warnings",
+    "check": "wireit",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "lint": "eslint . --concurrency auto",
+    "lint": "wireit",
     "lint:fix": "eslint . --fix --concurrency auto",
-    "format": "prettier --check .",
+    "format": "wireit",
     "format:fix": "prettier --write .",
     "test:unit": "vitest",
-    "test": "pnpm test:unit -- --run",
+    "test": "wireit",
+    "test:coverage": "wireit",
     "test:e2e": "playwright test",
     "release": "changeset publish"
   }

package/dist/components/widgets/audio-input/properties.svelte.d.ts

@@ -1,8 +0,0 @@
-interface Props {
-    supportedCodecs: string[];
-    sampleRateHz: number;
-    numChannels: number;
-}
-declare const Properties: import("svelte").Component<Props, {}, "">;
-type Properties = ReturnType<typeof Properties>;
-export default Properties;

package/dist/components/widgets/audio-output/properties.svelte

@@ -1,26 +0,0 @@
-<script lang="ts">
-	interface Props {
-		supportedCodecs: string[]
-		sampleRateHz: number
-		numChannels: number
-	}
-
-	const { supportedCodecs, sampleRateHz, numChannels }: Props = $props()
-</script>
-
-<dl class="font-roboto-mono flex flex-col gap-y-2 text-sm">
-	<div class="flex flex-col gap-0.5">
-		<dt class="text-default w-50 min-w-50 pr-2 font-medium">Supported Codecs</dt>
-		<dd class="text-subtle-1">
-			{supportedCodecs.length > 0 ? supportedCodecs.join(', ') : 'None'}
-		</dd>
-	</div>
-	<div class="flex flex-col gap-0.5">
-		<dt class="text-default w-50 min-w-50 pr-2 font-medium">Sample Rate</dt>
-		<dd class="text-subtle-1">{sampleRateHz} Hz</dd>
-	</div>
-	<div class="flex flex-col gap-0.5">
-		<dt class="text-default w-50 min-w-50 pr-2 font-medium">Channels</dt>
-		<dd class="text-subtle-1">{numChannels}</dd>
-	</div>
-</dl>

package/dist/components/widgets/audio-output/properties.svelte.d.ts

@@ -1,8 +0,0 @@
-interface Props {
-    supportedCodecs: string[];
-    sampleRateHz: number;
-    numChannels: number;
-}
-declare const Properties: import("svelte").Component<Props, {}, "">;
-type Properties = ReturnType<typeof Properties>;
-export default Properties;

package/dist/components/widgets/motion/pose-input.svelte.d.ts

@@ -1,8 +0,0 @@
-import type { Pose } from '@viamrobotics/sdk';
-interface Props {
-    pose: Pose;
-    onPoseChange: (pose: Pose) => void;
-}
-declare const PoseInput: import("svelte").Component<Props, {}, "">;
-type PoseInput = ReturnType<typeof PoseInput>;
-export default PoseInput;