@weasel-js/labkit 1.6.0 → 1.7.0

package/dist/index.js

@@ -1,49 +1,59 @@
-import { resolveLoupe, TrialLoupe } from './chunk-ERFMC6WU.js';
-export { CanvasLoupe, DomLoupe, LOUPE_DEFAULTS, LOUPE_MAGNIFY_ID, LOUPE_PEEK_ID, LoupeBubble, LoupeGestures, TrialLoupe, createLoupeActions, drawCanvasLens, lensCamera, lensSourceRect, resolveLoupe, sampleStack, useLoupe } from './chunk-ERFMC6WU.js';
+import { resolveLoupe, TrialLoupe } from './chunk-M7HP3FTK.js';
+export { CanvasLoupe, DomLoupe, LOUPE_DEFAULTS, LOUPE_MAGNIFY_ID, LOUPE_PEEK_ID, LoupeBubble, LoupeGestures, TrialLoupe, createLoupeActions, drawCanvasLens, lensCamera, lensSourceRect, resolveLoupe, sampleStack, useLoupe } from './chunk-M7HP3FTK.js';
 import { createEventBus, pushSnapshot, redo, undo } from './chunk-RL2LOLNI.js';
 export { clearUndo, createEventBus, emptyStack, pushSnapshot, redo, undo } from './chunk-RL2LOLNI.js';
-import { useDragDrop, DragOverlay, Palette } from './chunk-RS3HRQWU.js';
+import { useDragDrop, DragOverlay, Palette } from './chunk-WPLAANH4.js';
 import { useTiledSurface } from './chunk-IJJUK4FU.js';
 export { composeRects, rectsEqual, toDeviceRect, useTiledSurface } from './chunk-IJJUK4FU.js';
 import { useJob } from './chunk-HXXTULDN.js';
 export { useJob } from './chunk-HXXTULDN.js';
-import { suppressContributions, mergeContributions, builtinContributions, TitleBarRegion, ToolbarRegion, PaletteRegion, ViewportRegion, SidebarRegion, StatusRegion, resolveLabTool, AnnotationsContext, useLabChromeContext, labContributions, LabHeaderRegion, LabFooterRegion, LabAsideRegion, LabSidebarRegion } from './chunk-H5VIV7MQ.js';
-export { AnnotationsContext, ExportMenu, LabAsideRegion, LabFooterRegion, LabHeaderRegion, LabSidebarRegion, MarkList, PaletteRegion, SidebarRegion, StatusRegion, TitleBarRegion, ToolbarRegion, ViewportRegion, builtinContributions, contributionsIn, labContributions, mergeContributions, suppressContributions, toolContributions, useAnnotations, useAnnotationsOptional, useLabChromeContext } from './chunk-H5VIV7MQ.js';
-import { Split, JobProgress, Legend, FloatingPanel } from './chunk-ZORVNOKX.js';
-export { FloatingPanel, JobProgress, Legend, Split } from './chunk-ZORVNOKX.js';
-import { Toolbar, StatusBar, ScaleIndicator, ZoomControl } from './chunk-3FI7Y4R4.js';
-export { FpsMeter, ScaleIndicator, StatusBar, Toolbar, ZoomControl } from './chunk-3FI7Y4R4.js';
-import './chunk-SBXNQW4G.js';
-import { unruledConfigSchema, createLabStore, openLabStore, panelKey } from './chunk-MOLIUNVH.js';
-export { CURRENT_DOCUMENT_VERSION, dockPanel, labDocumentKey, openLabStore, panelKey, quarantineKey, undockPanel, useTrialState } from './chunk-MOLIUNVH.js';
+import { markCommands, markSvgNodes } from './chunk-4LJSC7MB.js';
+export { markCommands, markSvgNodes } from './chunk-4LJSC7MB.js';
+import { ANNOTATION_WEASEL_TOOLS, annotationToolInfo, suppressContributions, mergeContributions, builtinContributions, TitleBarRegion, ToolbarRegion, PaletteRegion, ViewportRegion, SidebarRegion, StatusRegion, resolveLabTool, useLabChromeContext, labContributions, labAnnotationTools, LabHeaderRegion, LabFooterRegion, LabAsideRegion, LabSidebarRegion } from './chunk-I5DUQ5HM.js';
+export { ANNOTATION_TOOLS, ANNOTATION_WEASEL_TOOLS, ExportMenu, LabAsideRegion, LabFooterRegion, LabHeaderRegion, LabSidebarRegion, MarkList, PaletteRegion, SidebarRegion, StatusRegion, TitleBarRegion, ToolbarRegion, ViewportRegion, annotationToolInfo, builtinContributions, contributionsIn, labContributions, mergeContributions, suppressContributions, toolContributions, useLabChromeContext } from './chunk-I5DUQ5HM.js';
+import { AnnotationsContext } from './chunk-3RY6WL5T.js';
+export { AnnotationsContext, useAnnotations, useAnnotationsOptional } from './chunk-3RY6WL5T.js';
+import { Split, JobProgress, Legend } from './chunk-FMK7UQ6V.js';
+export { JobProgress, Legend, Readout, Split } from './chunk-FMK7UQ6V.js';
+import { FloatingPanel } from './chunk-J7OWWTCW.js';
+export { FloatingPanel } from './chunk-J7OWWTCW.js';
+import { Toolbar, StatusBar, ScaleIndicator, ZoomControl } from './chunk-7BO7HNGF.js';
+export { FpsMeter, ScaleIndicator, StatusBar, Toolbar, ZoomControl } from './chunk-7BO7HNGF.js';
+import './chunk-CZZPXUOU.js';
+import { unruledConfigSchema, createLabStore, openLabStore, panelKey } from './chunk-YT75VYRD.js';
+export { CURRENT_DOCUMENT_VERSION, dockPanel, labDocumentKey, openLabStore, panelKey, quarantineKey, undockPanel, useTrialState } from './chunk-YT75VYRD.js';
 import { newId, useWarnIgnoredChange, useOpenOnce, PersistenceContext, createRecordCache, noneAdapter, defaultStorage, usePersistedState } from './chunk-RWNDDKOH.js';
 export { Persistence, createIndexedDbAdapter, createMemoryAdapter, indexedDbAdapter, localStorageAdapter, noneAdapter, sessionStorageAdapter, urlHashAdapter, usePersistedState } from './chunk-RWNDDKOH.js';
-export { ControlPanel } from './chunk-HFRE4QQV.js';
-import { useConfigSchema } from './chunk-USO6TERP.js';
-export { sectionTree, useConfigSchema } from './chunk-USO6TERP.js';
+export { ControlPanel, inDialog, summarizeValue } from './chunk-T5IBSPAM.js';
+import { useConfigSchema } from './chunk-GOZLNM4L.js';
+export { sectionTree, useConfigSchema } from './chunk-GOZLNM4L.js';
 import { useLabContext, LabContext } from './chunk-Z76KEZAX.js';
 export { LabContext, useLabContext } from './chunk-Z76KEZAX.js';
-import { useResolvedConfig } from './chunk-BVL7Y574.js';
-export { BaseNode, BooleanNode, ColorNode, CustomNode, EnumNode, GroupNode, ListNode, NumberNode, StringNode, ValueNode, applyRules, builtinRules, f, isConfigBranch, resolveConfigSchema, titleCase, useResolvedConfig } from './chunk-BVL7Y574.js';
-export { fromConfigFields, isLeafVisible } from './chunk-VQ47KWD5.js';
-import { hasConfigPath, schemaNodeAtPath, applyConfigWrite, resolveAutoConfig, isAuto, isRecord, autoPathsOf, fillConfigDefaults } from './chunk-AWH3SRPW.js';
-export { auto, autoPathsOf, fillConfigDefaults, hasConfigPath, inDialog, isAuto, resolveAutoConfig, schemaNodeAtPath, summarizeValue, valueAtPath, withValueAtPath } from './chunk-AWH3SRPW.js';
-import { CameraWheelContext, as2DView, DEFAULT_VIEW, CanvasStack, Stage, withZoom, fitStage } from './chunk-TT5C5S6R.js';
-export { CanvasStack, DEFAULT_VIEW, Stage, as2DView, fitStage, usePanZoom } from './chunk-TT5C5S6R.js';
-export { centerOn, zoomAt } from './chunk-H6ZAOWNE.js';
-import { applyCamera } from './chunk-2AYGEN57.js';
-export { DEFAULT_FRAME, applyCamera, resolveFrame, screenToWorld, worldToScreen } from './chunk-2AYGEN57.js';
+import { useResolvedConfig } from './chunk-FZ7YFQN7.js';
+export { BaseNode, BooleanNode, ColorNode, CustomNode, EnumNode, GroupNode, ListNode, NumberNode, StringNode, ValueNode, applyRules, builtinRules, f, isConfigBranch, resolveConfigSchema, titleCase, useResolvedConfig } from './chunk-FZ7YFQN7.js';
+export { fromConfigFields, isLeafVisible } from './chunk-KMJ7RWD3.js';
+import { hasConfigPath, schemaNodeAtPath, applyConfigWrite, resolveAutoConfig, isAuto, isRecord, autoPathsOf, fillConfigDefaults } from './chunk-Y23G2VZL.js';
+export { auto, autoPathsOf, fillConfigDefaults, hasConfigPath, isAuto, resolveAutoConfig, schemaNodeAtPath, valueAtPath, withValueAtPath } from './chunk-Y23G2VZL.js';
+import { CanvasStack, Stage, fitStage } from './chunk-ZIFPHIWZ.js';
+export { CanvasStack, Stage, fitStage } from './chunk-ZIFPHIWZ.js';
+export { centerOn, zoomAt } from './chunk-JVBYV6TL.js';
+export { screenToWorld, worldToScreen } from './chunk-AWQG7FCC.js';
 import { useSurfaceOptional, useSurfaceCanvas, useTileId, SurfaceContext, SurfaceCanvasContext } from './chunk-WIG6XHJ7.js';
 export { SurfaceCanvasContext, SurfaceContext, useSurface, useSurfaceCanvas, useSurfaceOptional, useSurfaceTile, useTileId } from './chunk-WIG6XHJ7.js';
+import { CameraWheelContext, as2DView, CameraRegistryContext, DEFAULT_VIEW, CameraPublishContext, createCameraRegistry, withZoom } from './chunk-UNAZSLWE.js';
+export { CameraContext, CameraInput, CameraPublishContext, CameraRegistryContext, CameraScope, DEFAULT_VIEW, as2DView, createCameraRegistry, usePublishCamera } from './chunk-UNAZSLWE.js';
+import { applyCamera } from './chunk-24W5VEJW.js';
+export { DEFAULT_FRAME, applyCamera, resolveFrame } from './chunk-24W5VEJW.js';
 import { CanvasStackContext } from './chunk-CQLQPQ4P.js';
 export { CanvasStackContext } from './chunk-CQLQPQ4P.js';
 import { LabStoreContext, TrialIdProvider, TrialIdContext } from './chunk-2YILQ7Y5.js';
 export { LabStoreContext, LabStoreProvider, TrialIdContext, TrialIdProvider, useLabStore, useTrialId } from './chunk-2YILQ7Y5.js';
 import './chunk-2RVCB2PT.js';
-import { y, I, A, T, i2, P, m, H, serializeSvg, D, S2, oe, d2, s3, c, Ht, o2, a6, l5, u5, a5, r3, a7, i3, o4, s6, c5, l7, p, f2, u4, g, T2, y2, l8, b, c6, i4, l4, C, S, ae, oe2, B, b2, A2, n6, s5, m4, l2, u, g2, u3, S4, r4, n7, r5, i5, p2, f, n8, o3, c3, c4, w, L, n9, k, $2 } from './chunk-WUJXJC5O.js';
-export { c as Button, re as CloseIcon, Pe as CollapseIcon, _ as CurveField, Fe as ExpandIcon, l as Icon, u4 as Input, l9 as Jog, D as LayerList, ge as PauseIcon, he as PlayIcon, V as PropertyControl, B as PropertyField, b2 as PropertyGroup, oe2 as PropertyList, ae as PropertyPanel, L3 as PropertyRow, se as PropertySpan, Z as ResetIcon, T2 as Select, ve as StepBackIcon, $ as StepForwardIcon, _e as StopIcon, x as Subpanel, a5 as ToggleBar, oe3 as TokenPanel, H2 as inferTokenType, S2 as moveLayers, O as refitScale } from './chunk-WUJXJC5O.js';
-import { textCommand, ellipsePath, linePath, markerDrawCommands, rectPath, createScene, asNodeId as asNodeId$1, WeaselProvider, SceneCanvas, sceneFromJSON, PathBuilder, renderSceneToPixels, useActiveToolContext } from '@weasel-js/core';
-import { createContext, useState, useRef, useEffect, useCallback, useContext, useMemo, useId, Children, useLayoutEffect, useSyncExternalStore } from 'react';
+import { E3, x3, X, U, G, d3, o3, c, Xt, o5, a8, l4, u4, a7, r3, a10, i2, o6, s4, c6, l6, p, f2, u3, y, E2, y2, l7, S, c7, i4, f3, D, T, re2, ie2, R, b2, j, n6, a11, m3, l2, u, _2, d2, S3, r4, n7, r5, i5, p2, f, n8, o4, c4, c5, w, L, n9, j2, ye, n2 } from './chunk-MIM5R4ZT.js';
+export { c as Button, V as CloseIcon, xe as CollapseIcon, _ as CurveField, i3 as DetailList, a4 as DetailRow, Se as ExpandIcon, l as Icon, u3 as Input, l8 as Jog, E3 as LayerList, re as PauseIcon, ne as PlayIcon, z2 as PropertyControl, R as PropertyField, b2 as PropertyGroup, ie2 as PropertyList, re2 as PropertyPanel, I as PropertyRow, ae2 as PropertySpan, B as ResetIcon, E2 as Select, ae as StepBackIcon, $ as StepForwardIcon, ie as StopIcon, x2 as Subpanel, a7 as ToggleBar, oe as TokenPanel, H2 as inferTokenType, x3 as moveLayers, O2 as refitScale } from './chunk-MIM5R4ZT.js';
+import { serializeSvg } from './chunk-275JRRVD.js';
+import { makeViewportZoomAction, createScene, asNodeId as asNodeId$1, WeaselProvider, SceneCanvas, createPointerStore, PointerContextProvider, DepRegistryProvider, ActionsProvider, ActiveToolContextProvider, useActionsRegistry, useDepSource, ActionDisabledReason, useGestureDispatcher, sceneFromJSON, renderSceneToPixels, useActiveToolContext } from '@weasel-js/core';
+import { createContext, useState, useRef, useEffect, useCallback, useContext, useMemo, useSyncExternalStore, useId, Children, useLayoutEffect } from 'react';
 import { flushSync, createPortal } from 'react-dom';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { defineTheme, weaselTheme, colorCount, resolveTheme, colorAt } from '@weasel-js/theme';
@@ -53,101 +63,13 @@ import { Provider, StrategyRegistryProvider, DragProvider, Container, useDragHan
 import { asNodeId, Store, createNode, floatingStrategy, gridStrategy } from 'windease';
 import { Focusable } from 'react-aria-components';
 
-var MARK_COLOR = "#e5484d";
-var MARK_WIDTH = 2;
-var TEXT_SIZE = 14;
-var POINT_RADIUS = 4;
-var toWorld = (p3, content) => ({
-  x: p3.x * content.w,
-  y: p3.y * content.h
-});
-function vertices(m3, content) {
-  const stored = m3.data.points;
-  if (stored && stored.length >= 2) return stored.map((p3) => toWorld(p3, content));
-  const { x: x2, y: y3, width, height } = m3.pose;
-  return [
-    { x: x2, y: y3 },
-    { x: x2 + width, y: y3 + height }
-  ];
-}
-function polyline(points) {
-  const b3 = new PathBuilder();
-  const first = points[0];
-  if (!first) return rectPath(0, 0, 0, 0);
-  b3.moveTo(first.x, first.y);
-  for (const p3 of points.slice(1)) b3.lineTo(p3.x, p3.y);
-  return b3.build();
-}
-function markCommands(m3, content, style = {}) {
-  const color = style.color ?? MARK_COLOR;
-  const stroke = {
-    paint: { color },
-    width: MARK_WIDTH,
-    cap: "round",
-    join: "round",
-    ...style.stale ? { dash: [6, 4] } : {}
-  };
-  switch (m3.data.kind) {
-    case "rect":
-      return [
-        { kind: "path", path: rectPath(m3.pose.x, m3.pose.y, m3.pose.width, m3.pose.height), stroke }
-      ];
-    case "ellipse":
-      return [{ kind: "path", path: ellipsePath(m3.pose), stroke }];
-    case "line": {
-      const [a4, b3] = vertices(m3, content);
-      return [{ kind: "path", path: linePath(a4, b3), stroke }];
-    }
-    case "arrow": {
-      const [a4, b3] = vertices(m3, content);
-      const marked = { ...stroke, markerEnd: "arrow" };
-      const path = linePath(a4, b3);
-      return [
-        { kind: "path", path, stroke: marked },
-        ...markerDrawCommands(path, marked, MARK_WIDTH, void 0)
-      ];
-    }
-    case "stroke":
-      return [{ kind: "path", path: polyline(vertices(m3, content)), stroke }];
-    case "point": {
-      const stored = m3.data.points?.[0];
-      const c6 = stored ? toWorld(stored, content) : { x: m3.pose.x, y: m3.pose.y };
-      const ring = {
-        x: c6.x - POINT_RADIUS,
-        y: c6.y - POINT_RADIUS,
-        width: 2 * POINT_RADIUS,
-        height: 2 * POINT_RADIUS
-      };
-      return [{ kind: "path", path: ellipsePath(ring), stroke }];
-    }
-    case "text": {
-      const text = m3.data.title;
-      if (!text) return [];
-      return [
-        textCommand(
-          m3.pose.x,
-          m3.pose.y,
-          text,
-          { fontSize: TEXT_SIZE },
-          void 0,
-          void 0,
-          void 0,
-          {
-            fill: { color }
-          }
-        )
-      ];
-    }
-  }
-}
-
 // src/annotations/staleness.ts
 function seenFrom(config, keys) {
   const out = {};
   if (config === null || typeof config !== "object") return out;
   const src = config;
-  for (const k2 of keys) {
-    if (k2 in src) out[k2] = src[k2];
+  for (const k of keys) {
+    if (k in src) out[k] = src[k];
   }
   return out;
 }
@@ -155,9 +77,9 @@ function isStale(seen, config, keys) {
   if (!seen || keys.length === 0) return false;
   if (config === null || typeof config !== "object") return false;
   const src = config;
-  for (const k2 of keys) {
-    if (!(k2 in seen)) continue;
-    if (!Object.is(seen[k2], src[k2])) return true;
+  for (const k of keys) {
+    if (!(k in seen)) continue;
+    if (!Object.is(seen[k], src[k])) return true;
   }
   return false;
 }
@@ -168,64 +90,13 @@ function createMarkDrawOne(opts) {
 }
 function resolveMarkStyle(data, opts) {
   return {
-    color: opts.meaning?.statuses?.find((s4) => s4.id === data.status)?.color,
+    color: opts.meaning?.statuses?.find((s2) => s2.id === data.status)?.color,
     // Read off the node rather than through the store's `isStale`, which
     // wants a projected Annotation this path does not have.
     stale: isStale(data.seen, opts.config, opts.positionDependsOn ?? [])
   };
 }
 
-// src/annotations/svgNodes.ts
-var NO_PAINT = { kind: "none" };
-function toSvgPaint(paint) {
-  if (!paint) return NO_PAINT;
-  if ("color" in paint && typeof paint.color === "string") {
-    return {
-      kind: "solid",
-      color: paint.color,
-      ...paint.opacity != null ? { opacity: paint.opacity } : {}
-    };
-  }
-  return { kind: "gradient", paint };
-}
-function toSvgStroke(stroke) {
-  return {
-    paint: toSvgPaint(stroke.paint),
-    width: stroke.width ?? 1,
-    ...stroke.cap ? { cap: stroke.cap } : {},
-    ...stroke.join ? { join: stroke.join } : {},
-    ...stroke.dash ? { dash: [...stroke.dash] } : {},
-    ...stroke.miterLimit != null ? { miterLimit: stroke.miterLimit } : {},
-    ...stroke.align ? { align: stroke.align } : {}
-  };
-}
-function toSvgNode(cmd, m3) {
-  if (cmd.kind === "path") {
-    return {
-      kind: "path",
-      path: cmd.path,
-      fill: toSvgPaint(cmd.fill),
-      ...cmd.stroke ? { stroke: toSvgStroke(cmd.stroke) } : {}
-    };
-  }
-  if (cmd.kind === "text") {
-    return {
-      kind: "text",
-      x: cmd.x,
-      y: cmd.y,
-      width: m3.pose.width,
-      height: m3.pose.height,
-      text: cmd.runs.map((run) => run.text).join(""),
-      style: cmd.style,
-      ...cmd.runs[0]?.fill ? { fill: cmd.runs[0].fill } : {}
-    };
-  }
-  throw new Error(`[labkit] a mark drew a '${cmd.kind}' command, which has no vector form`);
-}
-function markSvgNodes(m3, content, style = {}) {
-  return markCommands(m3, content, style).map((cmd) => toSvgNode(cmd, m3));
-}
-
 // src/annotations/capture.ts
 var SVG_NS = "http://www.w3.org/2000/svg";
 function capturePlan(base, format) {
@@ -368,12 +239,12 @@ async function captureTarget(args, opts = {}) {
 }
 
 // src/annotations/frac.ts
-function fracToWorld(f4, content) {
+function fracToWorld(f5, content) {
   return {
-    x: f4.x * content.w,
-    y: f4.y * content.h,
-    width: f4.w * content.w,
-    height: f4.h * content.h
+    x: f5.x * content.w,
+    y: f5.y * content.h,
+    width: f5.w * content.w,
+    height: f5.h * content.h
   };
 }
 function worldToFrac(r4, content) {
@@ -382,12 +253,12 @@ function worldToFrac(r4, content) {
   return { x: r4.x * sx, y: r4.y * sy, w: r4.width * sx, h: r4.height * sy };
 }
 var DP = 1e4;
-function roundFrac(f4) {
+function roundFrac(f5) {
   return {
-    x: Math.round(f4.x * DP) / DP,
-    y: Math.round(f4.y * DP) / DP,
-    w: Math.round(f4.w * DP) / DP,
-    h: Math.round(f4.h * DP) / DP
+    x: Math.round(f5.x * DP) / DP,
+    y: Math.round(f5.y * DP) / DP,
+    w: Math.round(f5.w * DP) / DP,
+    h: Math.round(f5.h * DP) / DP
   };
 }
 function fracContains(box, pt, tol = 0) {
@@ -438,13 +309,13 @@ var MarkHistory = class {
     return null;
   }
   canUndo(at) {
-    return this.next(this.undoable, (s4) => s4.canUndo(), at) !== null;
+    return this.next(this.undoable, (s2) => s2.canUndo(), at) !== null;
   }
   canRedo(at) {
-    return this.next(this.redoable, (s4) => s4.canRedo(), at) !== null;
+    return this.next(this.redoable, (s2) => s2.canRedo(), at) !== null;
   }
   undo(at) {
-    const target = this.next(this.undoable, (s4) => s4.canUndo(), at);
+    const target = this.next(this.undoable, (s2) => s2.canUndo(), at);
     const scene = target === null ? void 0 : at(target);
     if (!scene) return false;
     this.replaying = "undo";
@@ -455,7 +326,7 @@ var MarkHistory = class {
     }
   }
   redo(at) {
-    const target = this.next(this.redoable, (s4) => s4.canRedo(), at);
+    const target = this.next(this.redoable, (s2) => s2.canRedo(), at);
     const scene = target === null ? void 0 : at(target);
     if (!scene) return false;
     this.replaying = "redo";
@@ -510,6 +381,12 @@ function createAnnotationStore(opts) {
   for (const target of Object.keys(restore ?? {})) sceneFor(target);
   const targetOf = (id) => targets().find((t) => t.id === id);
   const contentOf = (id) => targetOf(id)?.content ?? NO_CONTENT;
+  const drawOptionsFor = (info) => ({
+    content: info.content,
+    positionDependsOn: info.positionDependsOn,
+    config: opts.config?.(),
+    meaning: typeof opts.meaning === "function" ? opts.meaning() : opts.meaning
+  });
   const project = (target, node) => {
     const found = scenes.get(target)?.get(asNodeId$1(node));
     if (!found) return void 0;
@@ -530,21 +407,21 @@ function createAnnotationStore(opts) {
     if (!scene) return [];
     const out = [];
     for (const id of scene.renderOrder()) {
-      const a4 = project(target, String(id));
-      if (a4) out.push(a4);
+      const a6 = project(target, String(id));
+      if (a6) out.push(a6);
     }
     return out;
   };
   const all = () => liveTargets().flatMap(marksOn);
-  const matches = (a4, q) => {
-    if (q.target !== void 0 && a4.target !== q.target) return false;
-    if (q.kind !== void 0 && a4.kind !== q.kind) return false;
-    if (q.status !== void 0 && a4.status !== q.status) return false;
+  const matches = (a6, q) => {
+    if (q.target !== void 0 && a6.target !== q.target) return false;
+    if (q.kind !== void 0 && a6.kind !== q.kind) return false;
+    if (q.status !== void 0 && a6.status !== q.status) return false;
     if (q.tags !== void 0) {
-      const have = a4.tags ?? [];
+      const have = a6.tags ?? [];
       for (const t of q.tags) if (!have.includes(t)) return false;
     }
-    if (q.where && !q.where(a4)) return false;
+    if (q.where && !q.where(a6)) return false;
     return true;
   };
   const nodeOf = (id) => {
@@ -562,17 +439,17 @@ function createAnnotationStore(opts) {
       return parts ? project(parts.target, parts.node) : void 0;
     },
     query(q) {
-      return q ? all().filter((a4) => matches(a4, q)) : all();
+      return q ? all().filter((a6) => matches(a6, q)) : all();
     },
     hitTest(target, pt, tol = 0) {
-      return marksOn(target).filter((a4) => fracContains(a4.frac, pt, tol)).reverse();
+      return marksOn(target).filter((a6) => fracContains(a6.frac, pt, tol)).reverse();
     },
     within(target, box) {
-      return marksOn(target).filter((a4) => fracEncloses(box, a4.frac));
+      return marksOn(target).filter((a6) => fracEncloses(box, a6.frac));
     },
-    isStale(a4, config) {
-      const keys = targetOf(a4.target)?.positionDependsOn ?? [];
-      return isStale(a4.seen, config, keys);
+    isStale(a6, config) {
+      const keys = targetOf(a6.target)?.positionDependsOn ?? [];
+      return isStale(a6.seen, config, keys);
     },
     canUndo() {
       return history.canUndo(historySceneAt);
@@ -610,7 +487,7 @@ function createAnnotationStore(opts) {
       for (const [target, scene] of scenes) {
         const next = wanted.get(target) ?? [];
         const now = scene.getSelection();
-        if (now.length === next.length && next.every((n5, i5) => String(now[i5]) === n5)) continue;
+        if (now.length === next.length && next.every((n6, i5) => String(now[i5]) === n6)) continue;
         scene.setSelection(next.map(asNodeId$1));
       }
     },
@@ -661,6 +538,20 @@ function createAnnotationStore(opts) {
       const found = nodeOf(id);
       if (found) found.scene.remove(asNodeId$1(found.node.id));
     },
+    paintedMarks(target) {
+      const info = targetOf(target);
+      const scene = scenes.get(target);
+      if (!info || !scene) return [];
+      const draw = drawOptionsFor(info);
+      return [...scene.renderOrder()].flatMap((id) => {
+        const node = scene.get(asNodeId$1(String(id)));
+        if (!node) return [];
+        const data = node.data;
+        return [
+          { mark: { pose: node.pose, data }, style: resolveMarkStyle(data, draw) }
+        ];
+      });
+    },
     async capture(target, captureOpts) {
       const info = targetOf(target);
       if (!info) throw new Error(`[labkit] no annotation target called '${target}'`);
@@ -668,12 +559,7 @@ function createAnnotationStore(opts) {
         {
           target,
           scene: sceneFor(target),
-          draw: {
-            content: info.content,
-            positionDependsOn: info.positionDependsOn,
-            config: opts.config?.(),
-            meaning: typeof opts.meaning === "function" ? opts.meaning() : opts.meaning
-          },
+          draw: drawOptionsFor(info),
           base: info.base,
           onWarn: (message) => console.warn(`[labkit] capture: ${message}`)
         },
@@ -695,34 +581,6 @@ function annotationsFromJSON(raw, targets, rest = {}) {
   return createAnnotationStore({ targets, restore: doc.scenes, ...rest });
 }
 
-// src/annotations/toolMap.ts
-var TOOLS = {
-  select: { weaselTool: "select" },
-  stroke: { weaselTool: "pencil", kind: "stroke" },
-  line: { weaselTool: "line", kind: "line" },
-  arrow: { weaselTool: "line", kind: "arrow" },
-  rect: { weaselTool: "rect", kind: "rect" },
-  ellipse: { weaselTool: "ellipse", kind: "ellipse" },
-  text: { weaselTool: "text", kind: "text" }
-};
-var ANNOTATION_TOOLS = [
-  // Not in `TOOLS`: an id the map does not carry is what leaves the overlay idle.
-  { id: "pointer", label: "Interact", icon: y, group: "annotate" },
-  { id: "select", label: "Select", icon: I, group: "annotate" },
-  { id: "stroke", label: "Freehand", icon: A, group: "annotate" },
-  { id: "line", label: "Line", icon: T, group: "annotate" },
-  { id: "arrow", label: "Arrow", icon: i2, group: "annotate" },
-  { id: "rect", label: "Rectangle", icon: P, group: "annotate" },
-  { id: "ellipse", label: "Ellipse", icon: m, group: "annotate" },
-  { id: "text", label: "Text", icon: H, group: "annotate" }
-];
-function annotationToolInfo(id) {
-  return id === null ? void 0 : TOOLS[id];
-}
-var ANNOTATION_WEASEL_TOOLS = [
-  ...new Set(Object.values(TOOLS).map((t) => t.weaselTool))
-];
-
 // src/annotations/view.ts
 function toWeaselView(v) {
   return { x: v.pan.x, y: v.pan.y, scale: { x: v.zoom, y: v.zoom } };
@@ -734,7 +592,7 @@ function fitView(content, pane) {
   const zoom = content.w > 0 && content.h > 0 ? Math.min(pane.w / content.w, pane.h / content.h) : 1;
   return { zoom: Number.isFinite(zoom) && zoom > 0 ? zoom : 1, pan: { x: 0, y: 0 } };
 }
-var sameRect = (a4, b3) => a4 !== null && a4.x === b3.x && a4.y === b3.y && a4.w === b3.w && a4.h === b3.h;
+var sameRect = (a6, b2) => a6 !== null && a6.x === b2.x && a6.y === b2.y && a6.w === b2.w && a6.h === b2.h;
 function ToolBridge({ toolId }) {
   const tools = useActiveToolContext();
   const setActive = tools.setActive;
@@ -873,13 +731,13 @@ function AnnotationOverlay({
         }
       ),
       canvas && input ? (
-        // One scope per pane: a shared <ActionsProvider> lets only the newest
-        // canvas under it respond to input, and the rest go silently dead.
+        // Isolated so each pane keeps its own selection and tool.
         /* @__PURE__ */ jsxs(WeaselProvider, { isolate: true, children: [
           /* @__PURE__ */ jsx(ToolBridge, { toolId: annotationToolInfo(activeToolId)?.weaselTool ?? "select" }),
           /* @__PURE__ */ jsx(
             SceneCanvas,
             {
+              features: ["pick", "move", "transform", "edit"],
               ref: attachSceneCanvas,
               scene,
               width: rect.w,
@@ -1063,21 +921,28 @@ var interstellar_theme_default = {
     accent: {
       by: "mode",
       dark: {
-        value: "#b08adb",
+        value: "#4f46e5",
         type: "color"
       }
     },
     "accent-hover": {
       by: "mode",
       dark: {
-        value: "#c6a3ee",
+        value: "#6d5dfc",
+        type: "color"
+      }
+    },
+    "accent-strong": {
+      by: "mode",
+      dark: {
+        value: "#7474fe",
         type: "color"
       }
     },
     "focus-ring": {
       by: "mode",
       dark: {
-        value: "rgba(176, 138, 219, 0.45)",
+        value: "rgba(116, 116, 254, 0.5)",
         type: "color"
       }
     },
@@ -1110,6 +975,24 @@ var interstellarTheme = defineTheme({
   ...interstellar_theme_default,
   extends: weaselTheme
 });
+
+// src/canvas/cameraZoom.ts
+function atScale(view, scale, at) {
+  return {
+    x: view.x + at.x / view.scale.x - at.x / scale,
+    y: view.y + at.y / view.scale.y - at.y / scale,
+    scale: { x: scale, y: scale }
+  };
+}
+function viewMiddle(camera) {
+  const size = camera.hostSize?.();
+  return size ? { x: size.width / 2, y: size.height / 2 } : { x: 0, y: 0 };
+}
+function zoomCameraTo(camera, zoom) {
+  const { min, max } = camera.zoomRange();
+  const scale = Math.min(max, Math.max(min, zoom));
+  camera.set(atScale(camera.get(), scale, viewMiddle(camera)));
+}
 function TrialBody({ sidebar, children, contentClassName, ...rest }) {
   return /* @__PURE__ */ jsx(
     Split,
@@ -1211,6 +1094,7 @@ function UndockedSections({ trialId, sections, onDock }) {
 var NO_OP = () => {
 };
 var NO_SECTIONS = Object.freeze({});
+var noSubscribe = () => NO_OP;
 function TrialChrome({
   trialId,
   record,
@@ -1229,15 +1113,15 @@ function TrialChrome({
   const lab = useLabContext();
   const storeCtx = useContext(LabStoreContext);
   if (!storeCtx) throw new Error("[labkit] TrialChrome requires <LabStoreProvider>");
-  const updateTrialView = useStore(storeCtx.store, (s4) => s4.updateTrialView);
-  const updateTrialSidebarWidth = useStore(storeCtx.store, (s4) => s4.updateTrialSidebarWidth);
-  const setTrialTitle = useStore(storeCtx.store, (s4) => s4.setTrialTitle);
-  const setTrialSectionCollapsed = useStore(storeCtx.store, (s4) => s4.setTrialSectionCollapsed);
-  const updateTrialConfig = useStore(storeCtx.store, (s4) => s4.updateTrialConfig);
-  const updateTrialState = useStore(storeCtx.store, (s4) => s4.updateTrialState);
-  const undockPanelAction = useStore(storeCtx.store, (s4) => s4.undockPanel);
-  const dockPanelAction = useStore(storeCtx.store, (s4) => s4.dockPanel);
-  const undockedPanels = useStore(storeCtx.store, (s4) => s4.undockedPanels);
+  const updateTrialView = useStore(storeCtx.store, (s2) => s2.updateTrialView);
+  const updateTrialSidebarWidth = useStore(storeCtx.store, (s2) => s2.updateTrialSidebarWidth);
+  const setTrialTitle = useStore(storeCtx.store, (s2) => s2.setTrialTitle);
+  const setTrialSectionCollapsed = useStore(storeCtx.store, (s2) => s2.setTrialSectionCollapsed);
+  const updateTrialConfig = useStore(storeCtx.store, (s2) => s2.updateTrialConfig);
+  const updateTrialState = useStore(storeCtx.store, (s2) => s2.updateTrialState);
+  const undockPanelAction = useStore(storeCtx.store, (s2) => s2.undockPanel);
+  const dockPanelAction = useStore(storeCtx.store, (s2) => s2.dockPanel);
+  const undockedPanels = useStore(storeCtx.store, (s2) => s2.undockedPanels);
   const undockedIds = useMemo(
     () => Object.values(undockedPanels).filter((p3) => p3.trialId === trialId).map((p3) => p3.sectionId),
     [undockedPanels, trialId]
@@ -1251,10 +1135,15 @@ function TrialChrome({
   );
   const title = record.title ?? instrument.title ?? instrument.name;
   const collapsedSections = record.collapsedSections ?? NO_SECTIONS;
+  const cameras = useContext(CameraRegistryContext);
+  const camera = useSyncExternalStore(
+    cameras?.subscribe ?? noSubscribe,
+    () => cameras?.get(trialId) ?? null
+  );
   const ctx = useMemo(() => {
-    const setZoom = (z) => {
-      if (!view2d) return;
-      updateTrialView(trialId, withZoom(view2d, z));
+    const setZoom = (z2) => {
+      if (camera) zoomCameraTo(camera, z2);
+      else if (view2d) updateTrialView(trialId, withZoom(view2d, z2));
     };
     return {
       trialId,
@@ -1294,7 +1183,7 @@ function TrialChrome({
       undockedPanels: undockedIds,
       undockPanel: (sectionId, as) => undockPanelAction(trialId, sectionId, as),
       dockPanel: (sectionId) => dockPanelAction(trialId, sectionId),
-      savedSnapshots: lab.savedSnapshots.filter((s4) => s4.trialId === trialId),
+      savedSnapshots: lab.savedSnapshots.filter((s2) => s2.trialId === trialId),
       saveSnapshot: (name) => lab.saveSnapshot(trialId, name),
       loadSnapshot: (snapshotId) => lab.loadSnapshot(trialId, snapshotId),
       clone: () => lab.cloneTrial(trialId),
@@ -1326,7 +1215,8 @@ function TrialChrome({
     dockPanelAction,
     setTrialTitle,
     setTrialSectionCollapsed,
-    collapsedSections
+    collapsedSections,
+    camera
   ]);
   const contributions = useMemo(
     () => suppressContributions(
@@ -1410,8 +1300,8 @@ function Trial({ id, chrome, suppress }) {
   const lab = useLabContext();
   const storeCtx = useContext(LabStoreContext);
   if (!storeCtx) throw new Error("[labkit] <Trial> requires <LabStoreProvider>");
-  const instruments = useStore(storeCtx.store, (s4) => s4.instruments) ?? lab.instruments;
-  const record = useStore(storeCtx.store, (s4) => s4.trials.find((w2) => w2.id === id));
+  const instruments = useStore(storeCtx.store, (s2) => s2.instruments) ?? lab.instruments;
+  const record = useStore(storeCtx.store, (s2) => s2.trials.find((w2) => w2.id === id));
   const instrument = record ? instruments.find((i5) => i5.name === record.instrumentName) : void 0;
   const kept = useKeptMarks(instrument?.annotations?.storage, id);
   if (!record) {
@@ -1476,16 +1366,23 @@ function TrialRuntime({
   suppress
 }) {
   const wheelSlot = useRef(null);
+  const cameras = useContext(CameraRegistryContext);
+  const trialId = record.id;
+  const publishCamera = useMemo(
+    () => cameras ? (camera) => cameras.register(trialId, camera) : null,
+    [cameras, trialId]
+  );
+  const [pointer] = useState(createPointerStore);
   const canvasContainerRef = useRef(null);
   const loupeHostRef = useRef(null);
-  const updateTrialState = useStore(store, (s4) => s4.updateTrialState);
-  const updateTrialConfig = useStore(store, (s4) => s4.updateTrialConfig);
-  const updateTrialView = useStore(store, (s4) => s4.updateTrialView);
-  const updateTrialUndoStack = useStore(store, (s4) => s4.updateTrialUndoStack);
-  const updateTrialAnnotations = useStore(store, (s4) => s4.updateTrialAnnotations);
-  const labToolId = useStore(store, (s4) => s4.activeToolId);
-  const setLabTool = useStore(store, (s4) => s4.setLabTool);
-  const setTrialTool = useStore(store, (s4) => s4.setTrialTool);
+  const updateTrialState = useStore(store, (s2) => s2.updateTrialState);
+  const updateTrialConfig = useStore(store, (s2) => s2.updateTrialConfig);
+  const updateTrialView = useStore(store, (s2) => s2.updateTrialView);
+  const updateTrialUndoStack = useStore(store, (s2) => s2.updateTrialUndoStack);
+  const updateTrialAnnotations = useStore(store, (s2) => s2.updateTrialAnnotations);
+  const labToolId = useStore(store, (s2) => s2.activeToolId);
+  const setLabTool = useStore(store, (s2) => s2.setLabTool);
+  const setTrialTool = useStore(store, (s2) => s2.setTrialTool);
   const schema = useConfigSchema(instrument);
   const { config } = useResolvedConfig(schema, record.config, record.auto);
   const busRef = useRef(null);
@@ -1495,7 +1392,7 @@ function TrialRuntime({
   const [layerOrder, setLayerOrder] = useState(null);
   const [loupeOn, setLoupeOn] = useState(false);
   const visibleLayers = useMemo(
-    () => (instrument.canvas?.layers ?? []).filter((l8) => layerVisibility[l8.id] !== false).map((l8) => l8.id),
+    () => (instrument.canvas?.layers ?? []).filter((l7) => layerVisibility[l7.id] !== false).map((l7) => l7.id),
     [instrument.canvas, layerVisibility]
   );
   const undoCap = instrument.undo;
@@ -1610,12 +1507,13 @@ function TrialRuntime({
       view: record.view,
       setView,
       zoom: view2d?.zoom ?? 1,
-      setZoom: (z) => {
+      setZoom: (z2) => {
         if (!view2d) return;
-        updateTrialView(record.id, withZoom(view2d, z));
+        updateTrialView(record.id, withZoom(view2d, z2));
       },
       activeToolId: resolvedToolId,
-      visibleLayers
+      visibleLayers,
+      pointer
     },
     emit: (event) => {
       snapshotIfNeeded(event);
@@ -1656,7 +1554,7 @@ function TrialRuntime({
   const canvasLayers = useMemo(() => {
     if (!instrument.canvas) return [];
     const baseLayers = instrument.canvas.layers;
-    const ordered = layerOrder ? [...baseLayers].sort((a4, b3) => layerOrder.indexOf(a4.id) - layerOrder.indexOf(b3.id)) : baseLayers;
+    const ordered = layerOrder ? [...baseLayers].sort((a6, b2) => layerOrder.indexOf(a6.id) - layerOrder.indexOf(b2.id)) : baseLayers;
     return ordered.map((layer) => ({
       id: layer.id,
       visible: layerVisibility[layer.id] !== false,
@@ -1668,23 +1566,23 @@ function TrialRuntime({
   }, [instrument.canvas, record.state, config, layerVisibility, layerOrder]);
   const layerDescriptors = useMemo(() => {
     if (!instrument.layers) return [];
-    return instrument.layers.ids.map((l8) => typeof l8 === "string" ? { id: l8, label: l8 } : l8);
+    return instrument.layers.ids.map((l7) => typeof l7 === "string" ? { id: l7, label: l7 } : l7);
   }, [instrument.layers]);
   const layerItems = useMemo(() => {
-    const ordered = layerOrder ? [...layerDescriptors].sort((a4, b3) => layerOrder.indexOf(a4.id) - layerOrder.indexOf(b3.id)) : layerDescriptors;
+    const ordered = layerOrder ? [...layerDescriptors].sort((a6, b2) => layerOrder.indexOf(a6.id) - layerOrder.indexOf(b2.id)) : layerDescriptors;
     const pinnedLast = [
-      ...ordered.filter((l8) => !l8.alwaysOn),
-      ...ordered.filter((l8) => l8.alwaysOn)
+      ...ordered.filter((l7) => !l7.alwaysOn),
+      ...ordered.filter((l7) => l7.alwaysOn)
     ];
-    return pinnedLast.map((l8) => ({
-      id: l8.id,
-      label: l8.label,
-      locked: l8.alwaysOn === true,
-      visible: l8.alwaysOn === true || layerVisibility[l8.id] !== false
+    return pinnedLast.map((l7) => ({
+      id: l7.id,
+      label: l7.label,
+      locked: l7.alwaysOn === true,
+      visible: l7.alwaysOn === true || layerVisibility[l7.id] !== false
     }));
   }, [layerDescriptors, layerOrder, layerVisibility]);
   const dragDropResult = useDragDrop({
-    capability: instrument.dragDrop ?? { palette: [], onDrop: (_p, _i, s4) => s4 },
+    capability: instrument.dragDrop ?? { palette: [], onDrop: (_p, _i, s2) => s2 },
     canvasContainerRef,
     view: view2d ?? DEFAULT_VIEW,
     worldSpec: instrument.canvas?.worldSpec,
@@ -1794,11 +1692,11 @@ function TrialRuntime({
   );
   const layerListNode = useMemo(
     () => instrument.layers && layerDescriptors.length > 0 ? /* @__PURE__ */ jsx(
-      D,
+      E3,
       {
         items: layerItems,
         onReorder: (move) => {
-          setLayerOrder(S2(layerItems, move).map((l8) => l8.id));
+          setLayerOrder(x3(layerItems, move).map((l7) => l7.id));
           bus.emit("layers.reorder");
         },
         onVisibilityChange: (lid, visible) => {
@@ -1838,6 +1736,7 @@ function TrialRuntime({
       activeToolId: labTool
     }
   ) : null;
+  const scopedBody = /* @__PURE__ */ jsx(WeaselProvider, { isolate: true, children: /* @__PURE__ */ jsx(PointerContextProvider, { store: pointer, children: /* @__PURE__ */ jsx(CameraPublishContext.Provider, { value: publishCamera, children: body }) }) });
   return /* @__PURE__ */ jsx(TrialIdProvider, { trialId: record.id, children: /* @__PURE__ */ jsx(AnnotationsContext.Provider, { value: annotationsCap ? annotations : null, children: /* @__PURE__ */ jsx(CameraWheelContext.Provider, { value: wheelSlot, children: /* @__PURE__ */ jsxs(
     TrialChrome,
     {
@@ -1854,7 +1753,7 @@ function TrialRuntime({
       activeToolId: resolvedToolId,
       setActiveTool,
       children: [
-        body,
+        scopedBody,
         annotationOverlays
       ]
     }
@@ -1975,10 +1874,10 @@ function findOvershoot(bound, items, tolerance = 1) {
   let worst = null;
   for (const { item, edges } of items) {
     const y3 = edges.bottom - bound.bottom;
-    const x2 = edges.right - bound.right;
-    const by = Math.max(x2, y3);
+    const x3 = edges.right - bound.right;
+    const by = Math.max(x3, y3);
     if (by <= tolerance) continue;
-    if (!worst || by > worst.by) worst = { item, by, axis: y3 >= x2 ? "y" : "x" };
+    if (!worst || by > worst.by) worst = { item, by, axis: y3 >= x3 ? "y" : "x" };
   }
   return worst;
 }
@@ -2054,37 +1953,30 @@ function useLabFitWarning(labBody) {
 function LabHeader({ addTrial: addTrial2 = true }) {
   const lab = useLabContext();
   const only = lab.instruments.length === 1 ? lab.instruments[0] : null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    !addTrial2 ? null : only ? /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: "lk-lab-header__add",
-        onClick: () => lab.addTrial(only.name),
-        children: [
-          /* @__PURE__ */ jsx(oe, { size: 16 }),
-          /* @__PURE__ */ jsx("span", { children: "Add trial" })
-        ]
-      }
-    ) : /* @__PURE__ */ jsx(
-      d2,
-      {
-        "aria-label": "Add trial",
-        label: "Add trial\u2026",
-        items: lab.instruments.map((i5) => ({ value: i5.name, label: i5.title ?? i5.name })),
-        onAction: (name) => lab.addTrial(name)
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      s3,
-      {
-        className: "lk-lab-header__mode",
-        variant: "flat",
-        value: lab.mode,
-        onChange: lab.setMode
-      }
-    )
-  ] });
+  return /* @__PURE__ */ jsx(Fragment, { children: !addTrial2 ? null : only ? /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: "lk-lab-header__add",
+      onClick: () => lab.addTrial(only.name),
+      children: [
+        /* @__PURE__ */ jsx(G, { size: 16 }),
+        /* @__PURE__ */ jsx("span", { children: "Add trial" })
+      ]
+    }
+  ) : /* @__PURE__ */ jsx(
+    d3,
+    {
+      "aria-label": "Add trial",
+      label: "Add trial\u2026",
+      items: lab.instruments.map((i5) => ({ value: i5.name, label: i5.title ?? i5.name })),
+      onAction: (name) => lab.addTrial(name)
+    }
+  ) });
+}
+function LabThemeSwitcher() {
+  const lab = useLabContext();
+  return /* @__PURE__ */ jsx(o3, { value: lab.mode, onChange: lab.setMode });
 }
 function LabPalette({ tools, contributions }) {
   const ctx = useLabChromeContext();
@@ -2203,6 +2095,110 @@ function LabShell({
     footer && /* @__PURE__ */ jsx("footer", { className: "lk-shell-footer", children: footer })
   ] });
 }
+var ZOOM_ID = "viewport.zoom";
+var NO_TOOLS = /* @__PURE__ */ new Map();
+var CHANNELS = { contextMenu: false, ingest: false };
+var NO_ELEMENT = { current: null };
+var BASE = makeViewportZoomAction({ min: 1e-9, max: Number.POSITIVE_INFINITY });
+var KEY_BINDINGS = BASE.defaultBinding.filter((b2) => b2.spec.kind === "key");
+function shortcutFor(kind) {
+  const spec = KEY_BINDINGS.find((b2) => b2.opts?.params?.kind === kind)?.spec;
+  return spec?.key ? n2({ key: spec.key, mod: spec.mods?.mod }) : void 0;
+}
+function forZoom(camera) {
+  return {
+    get: camera.get,
+    set: camera.set,
+    hostSize: camera.hostSize,
+    recenter: () => atScale(camera.get(), 1, viewMiddle(camera))
+  };
+}
+var percent = new Intl.NumberFormat(void 0, { style: "percent", maximumFractionDigits: 0 });
+function LabZoom() {
+  return /* @__PURE__ */ jsx(DepRegistryProvider, { children: /* @__PURE__ */ jsx(ActionsProvider, { children: /* @__PURE__ */ jsx(ActiveToolContextProvider, { children: /* @__PURE__ */ jsx(LabZoomControls, {}) }) }) });
+}
+function LabZoomControls() {
+  const registry = useActionsRegistry();
+  const { focusedTrialId } = useLabContext();
+  const cameras = useContext(CameraRegistryContext);
+  const storeCtx = useContext(LabStoreContext);
+  if (!storeCtx) throw new Error("[labkit] <LabZoom> requires <LabStoreProvider>");
+  const camera = useSyncExternalStore(
+    cameras?.subscribe ?? noSubscribe2,
+    () => cameras && focusedTrialId ? cameras.get(focusedTrialId) : null
+  );
+  const zoom = useStore(storeCtx.store, (s2) => {
+    const record = s2.trials.find((t) => t.id === focusedTrialId);
+    return as2DView(record?.view)?.zoom ?? null;
+  });
+  const live = zoom !== null && camera !== null;
+  const view = useMemo(() => camera ? forZoom(camera) : null, [camera]);
+  const viewRef = useRef(view);
+  viewRef.current = live ? view : null;
+  useDepSource("view", () => viewRef.current);
+  useEffect(() => {
+    const action = {
+      ...BASE,
+      defaultBinding: KEY_BINDINGS,
+      enabled: () => viewRef.current ? true : ActionDisabledReason.NotApplicable
+    };
+    return registry.register(action);
+  }, [registry]);
+  useGestureDispatcher({
+    canvasRef: NO_ELEMENT,
+    actions: registry,
+    entriesById: NO_TOOLS,
+    channels: CHANNELS,
+    keyboard: "first"
+  });
+  const range = camera?.zoomRange();
+  const canIn = zoom !== null && range !== void 0 && zoom < range.max * (1 - 1e-9);
+  const canOut = zoom !== null && range !== void 0 && zoom > range.min * (1 + 1e-9);
+  const run = (kind) => () => {
+    registry.trigger(ZOOM_ID, { kind });
+  };
+  const hint = (label, kind) => {
+    const keys = shortcutFor(kind);
+    return keys ? `${label} (${keys})` : label;
+  };
+  const shown = live && zoom !== null ? percent.format(zoom) : null;
+  return /* @__PURE__ */ jsx(Toolbar, { "aria-label": "Zoom", children: /* @__PURE__ */ jsxs(Toolbar.Group, { "aria-label": "Zoom", children: [
+    /* @__PURE__ */ jsx(
+      Toolbar.Button,
+      {
+        iconOnly: true,
+        "aria-label": "Zoom out",
+        title: hint("Zoom out", "out"),
+        disabled: !canOut,
+        onClick: run("out"),
+        children: /* @__PURE__ */ jsx(X, { size: 16 })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Toolbar.Button,
+      {
+        "aria-label": shown ? `Zoom ${shown} \u2014 reset to actual size` : "Zoom unavailable",
+        title: live ? hint("Actual size", "reset") : "This trial has no camera",
+        disabled: !live,
+        onClick: run("reset"),
+        children: /* @__PURE__ */ jsx("span", { className: "lk-lab-zoom__readout", children: shown ?? "\u2013" })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Toolbar.Button,
+      {
+        iconOnly: true,
+        "aria-label": "Zoom in",
+        title: hint("Zoom in", "in"),
+        disabled: !canIn,
+        onClick: run("in"),
+        children: /* @__PURE__ */ jsx(U, { size: 16 })
+      }
+    )
+  ] }) });
+}
+var noSubscribe2 = () => () => {
+};
 var ZONE_ID = asNodeId("lk-workspace");
 var STRATEGIES = { grid: gridStrategy, floating: floatingStrategy };
 var FLOAT_ZONE_ID = asNodeId("lk-workspace-floating");
@@ -2237,7 +2233,7 @@ function Workspace({
   const tilePanels = useMemo(() => (panels ?? []).filter((p3) => p3.as === "tile"), [panels]);
   const floatPanels = useMemo(() => (panels ?? []).filter((p3) => p3.as === "floating"), [panels]);
   const wantedIds = [
-    ...items.map((_2, i5) => ids?.[i5] ?? `lk-ws-${i5}`),
+    ...items.map((_3, i5) => ids?.[i5] ?? `lk-ws-${i5}`),
     ...tilePanels.map((p3) => `lk-panel-${p3.key}`)
   ];
   const idKey = wantedIds.join(",");
@@ -2428,8 +2424,8 @@ var NEBULA_SLOTS = [
 ];
 function buildNebula(list, theme, mode, density) {
   const ctx = { theme, resolved: resolveTheme(theme, { mode, density }) };
-  const n5 = colorCount(list, ctx) ?? NEBULA_SLOTS.length;
-  const colors = Array.from({ length: n5 }, (_2, i5) => colorAt(list, i5, ctx));
+  const n6 = colorCount(list, ctx) ?? NEBULA_SLOTS.length;
+  const colors = Array.from({ length: n6 }, (_3, i5) => colorAt(list, i5, ctx));
   const blobs = colors.map((c6, i5) => {
     const p3 = NEBULA_SLOTS[i5 % NEBULA_SLOTS.length];
     return `radial-gradient(ellipse ${p3.sx} ${p3.sy} at ${p3.cx} ${p3.cy}, color-mix(in srgb, ${c6} 22%, transparent), transparent ${p3.stop})`;
@@ -2528,6 +2524,7 @@ function LabRuntime({
   labChrome,
   suppress,
   addTrial: addTrial2,
+  zoom = true,
   tools,
   configRules,
   controls,
@@ -2538,13 +2535,14 @@ function LabRuntime({
   useLayoutEffect(() => {
     store.getState().setInstruments(instruments);
   }, [instruments, store]);
-  const trials = useStore(store, (s4) => s4.trials);
+  const trials = useStore(store, (s2) => s2.trials);
+  const [cameras] = useState(createCameraRegistry);
   const [focusPick, setFocusPick] = useState(null);
   const focusedTrialId = trials.some((t) => t.id === focusPick) ? focusPick : trials[0]?.id ?? null;
-  const savedSnapshots = useStore(store, (s4) => s4.savedSnapshots);
-  const modeValue = useStore(store, (s4) => s4.mode);
-  const layout = useStore(store, (s4) => s4.layout);
-  const undockedPanels = useStore(store, (s4) => s4.undockedPanels);
+  const savedSnapshots = useStore(store, (s2) => s2.savedSnapshots);
+  const modeValue = useStore(store, (s2) => s2.mode);
+  const layout = useStore(store, (s2) => s2.layout);
+  const undockedPanels = useStore(store, (s2) => s2.undockedPanels);
   const panelHostsRef = useRef(null);
   if (panelHostsRef.current === null) panelHostsRef.current = createPanelHostRegistry();
   const outerSurface = useSurfaceOptional();
@@ -2626,10 +2624,10 @@ function LabRuntime({
     [undockedPanels]
   );
   const resolvedMode = useResolvedColorMode(modeValue);
-  const annotates = instruments.some((i5) => i5.annotations != null);
+  const annotationTools = useMemo(() => labAnnotationTools(instruments), [instruments]);
   const labChromeAll = useMemo(
-    () => labContributions([...annotates ? ANNOTATION_TOOLS : [], ...tools ?? []], labChrome),
-    [annotates, tools, labChrome]
+    () => labContributions([...annotationTools, ...tools ?? []], labChrome),
+    [annotationTools, tools, labChrome]
   );
   const hasFooterChrome = labChromeAll.some((c6) => c6.region === "footer");
   const hasPaneChrome = labChromeAll.some((c6) => c6.region === "sidebar" || c6.region === "aside");
@@ -2684,15 +2682,15 @@ function LabRuntime({
         const next = resetTrial(store.getState().trials, id, instruments);
         const record = next.find((w2) => w2.id === id);
         if (!record) return;
-        store.setState((s4) => ({
-          trials: s4.trials.map(
+        store.setState((s2) => ({
+          trials: s2.trials.map(
             (w2) => w2.id === id ? { ...w2, config: record.config, state: record.state, view: record.view } : w2
           )
         }));
       },
       savedSnapshots,
       saveSnapshot: (trialId, name) => {
-        const taken = store.getState().savedSnapshots.filter((s4) => s4.trialId === trialId).length;
+        const taken = store.getState().savedSnapshots.filter((s2) => s2.trialId === trialId).length;
         store.getState().saveSnapshot(trialId, name ?? `Snapshot ${taken + 1}`);
       },
       loadSnapshot: (trialId, snapshotId) => {
@@ -2702,8 +2700,8 @@ function LabRuntime({
         store.getState().deleteSnapshot(snapshotId);
       },
       mode: modeValue,
-      setMode: (m3) => {
-        store.getState().setMode(m3);
+      setMode: (m2) => {
+        store.getState().setMode(m2);
       },
       configRules,
       controls
@@ -2739,7 +2737,7 @@ function LabRuntime({
       children: trials.map((w2) => /* @__PURE__ */ jsx(Trial, { id: w2.id, chrome, suppress }, w2.id))
     }
   );
-  return /* @__PURE__ */ jsx(LabStoreContext.Provider, { value: { store }, children: /* @__PURE__ */ jsx(PersistenceContext.Provider, { value: opened.records, children: /* @__PURE__ */ jsx(AnnotationPreloadContext.Provider, { value: opened.marks, children: /* @__PURE__ */ jsx(LabContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(LabStoreContext.Provider, { value: { store }, children: /* @__PURE__ */ jsx(PersistenceContext.Provider, { value: opened.records, children: /* @__PURE__ */ jsx(AnnotationPreloadContext.Provider, { value: opened.marks, children: /* @__PURE__ */ jsx(LabContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(CameraRegistryContext.Provider, { value: cameras, children: /* @__PURE__ */ jsx(
     ThemeProvider,
     {
       theme,
@@ -2759,8 +2757,10 @@ function LabRuntime({
           ] }) : footer,
           header: /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(LabHeader, { ...addTrial2 !== void 0 ? { addTrial: addTrial2 } : {} }),
+            zoom ? /* @__PURE__ */ jsx(LabZoom, {}) : null,
             children,
-            /* @__PURE__ */ jsx(LabHeaderRegion, { contributions: labChromeAll })
+            /* @__PURE__ */ jsx(LabHeaderRegion, { contributions: labChromeAll }),
+            /* @__PURE__ */ jsx(LabThemeSwitcher, {})
           ] }),
           children: /* @__PURE__ */ jsx(PanelHostContext.Provider, { value: panelHostsRef.current, children: /* @__PURE__ */ jsx(SurfaceContext.Provider, { value: surface, children: /* @__PURE__ */ jsx(SurfaceCanvasContext.Provider, { value: surfaceCanvases, children: /* @__PURE__ */ jsxs("div", { className: "lk-lab__body", ref: labBodyRef, children: [
             outerSurface ? null : (
@@ -2803,7 +2803,7 @@ function LabRuntime({
         }
       )
     }
-  ) }) }) }) });
+  ) }) }) }) }) });
 }
 function LabBoundary({ children }) {
   return /* @__PURE__ */ jsx(LabStoreContext.Provider, { value: null, children: /* @__PURE__ */ jsx(PersistenceContext.Provider, { value: null, children: /* @__PURE__ */ jsx(AnnotationPreloadContext.Provider, { value: null, children: /* @__PURE__ */ jsx(LabContext.Provider, { value: null, children: /* @__PURE__ */ jsx(PanelHostContext.Provider, { value: null, children: /* @__PURE__ */ jsx(SurfaceContext.Provider, { value: null, children: /* @__PURE__ */ jsx(SurfaceCanvasContext.Provider, { value: { over: null, under: null }, children: /* @__PURE__ */ jsx(TrialIdContext.Provider, { value: null, children: /* @__PURE__ */ jsx(AnnotationsContext.Provider, { value: null, children: /* @__PURE__ */ jsx(CameraWheelContext.Provider, { value: null, children: /* @__PURE__ */ jsx(CanvasStackContext.Provider, { value: null, children: /* @__PURE__ */ jsx(TrialDragContext.Provider, { value: null, children: /* @__PURE__ */ jsx(ThemeContext.Provider, { value: null, children }) }) }) }) }) }) }) }) }) }) }) }) });
@@ -2908,25 +2908,25 @@ function ButtonsAndToggles() {
       /* @__PURE__ */ jsx(c, { variant: "secondary", iconOnly: true, ariaLabel: "Add", children: /* @__PURE__ */ jsx(Dot, {}) })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "Badge", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
-      /* @__PURE__ */ jsx(Ht, { shape: "pill", status: "accent", variant: "outline", size: "sm", children: "ACCENT" }),
-      /* @__PURE__ */ jsx(Ht, { status: "info", variant: "subtle", children: "INFO" }),
-      /* @__PURE__ */ jsx(Ht, { status: "warn", variant: "solid", children: "WARN" }),
-      /* @__PURE__ */ jsx(Ht, { status: "danger", variant: "solid", children: "DANGER" }),
-      /* @__PURE__ */ jsx(Ht, { status: "muted", children: "MUTED" })
+      /* @__PURE__ */ jsx(Xt, { shape: "pill", status: "accent", variant: "outline", size: "sm", children: "ACCENT" }),
+      /* @__PURE__ */ jsx(Xt, { status: "info", variant: "subtle", children: "INFO" }),
+      /* @__PURE__ */ jsx(Xt, { status: "warn", variant: "solid", children: "WARN" }),
+      /* @__PURE__ */ jsx(Xt, { status: "danger", variant: "solid", children: "DANGER" }),
+      /* @__PURE__ */ jsx(Xt, { status: "muted", children: "MUTED" })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "Checkbox, Switch", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
-      /* @__PURE__ */ jsx(o2, { isSelected: snap, onChange: setSnap, children: "Snap to grid" }),
-      /* @__PURE__ */ jsx(o2, { isIndeterminate: true, children: "Mixed" }),
-      /* @__PURE__ */ jsx(a6, { isSelected: wifi, onChange: setWifi, children: "Wifi" })
+      /* @__PURE__ */ jsx(o5, { isSelected: snap, onChange: setSnap, children: "Snap to grid" }),
+      /* @__PURE__ */ jsx(o5, { isIndeterminate: true, children: "Mixed" }),
+      /* @__PURE__ */ jsx(a8, { isSelected: wifi, onChange: setWifi, children: "Wifi" })
     ] }) }),
-    /* @__PURE__ */ jsx(Cell, { label: "RadioGroup", children: /* @__PURE__ */ jsxs(l5, { label: "Snap mode", orientation: "horizontal", defaultValue: "grid", children: [
-      /* @__PURE__ */ jsx(u5, { value: "off", children: "Off" }),
-      /* @__PURE__ */ jsx(u5, { value: "grid", children: "Grid" }),
-      /* @__PURE__ */ jsx(u5, { value: "pixel", children: "Pixel" })
+    /* @__PURE__ */ jsx(Cell, { label: "RadioGroup", children: /* @__PURE__ */ jsxs(l4, { label: "Snap mode", orientation: "horizontal", defaultValue: "grid", children: [
+      /* @__PURE__ */ jsx(u4, { value: "off", children: "Off" }),
+      /* @__PURE__ */ jsx(u4, { value: "grid", children: "Grid" }),
+      /* @__PURE__ */ jsx(u4, { value: "pixel", children: "Pixel" })
     ] }) }),
     /* @__PURE__ */ jsxs(Cell, { label: "ToggleBar", children: [
       /* @__PURE__ */ jsx(
-        a5,
+        a7,
         {
           ariaLabel: "Align",
           value: align,
@@ -2939,7 +2939,7 @@ function ButtonsAndToggles() {
         }
       ),
       /* @__PURE__ */ jsx(
-        a5,
+        a7,
         {
           ariaLabel: "Align, flat",
           variant: "flat",
@@ -2965,7 +2965,7 @@ function ButtonsAndToggles() {
         }
       ),
       /* @__PURE__ */ jsx(
-        a7,
+        a10,
         {
           items: [
             { value: "undo", label: "Undo", onAction: () => {
@@ -2978,7 +2978,7 @@ function ButtonsAndToggles() {
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "MenuButton, Disclosure", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
       /* @__PURE__ */ jsx(
-        d2,
+        d3,
         {
           label: "Add trial\u2026",
           onAction: () => {
@@ -2989,17 +2989,17 @@ function ButtonsAndToggles() {
           ]
         }
       ),
-      /* @__PURE__ */ jsx(i3, { open, onToggle: () => setOpen((o4) => !o4), label: "Shapes" })
+      /* @__PURE__ */ jsx(i2, { open, onToggle: () => setOpen((o5) => !o5), label: "Shapes" })
     ] }) }),
-    /* @__PURE__ */ jsx(Cell, { label: "Tabs", children: /* @__PURE__ */ jsxs(o4, { children: [
-      /* @__PURE__ */ jsxs(s6, { "aria-label": "Sections", children: [
-        /* @__PURE__ */ jsx(c5, { id: "props", children: "Props" }),
-        /* @__PURE__ */ jsx(c5, { id: "events", children: "Events" }),
-        /* @__PURE__ */ jsx(c5, { id: "snapshot", children: "Snapshot" })
+    /* @__PURE__ */ jsx(Cell, { label: "Tabs", children: /* @__PURE__ */ jsxs(o6, { children: [
+      /* @__PURE__ */ jsxs(s4, { "aria-label": "Sections", children: [
+        /* @__PURE__ */ jsx(c6, { id: "props", children: "Props" }),
+        /* @__PURE__ */ jsx(c6, { id: "events", children: "Events" }),
+        /* @__PURE__ */ jsx(c6, { id: "snapshot", children: "Snapshot" })
       ] }),
-      /* @__PURE__ */ jsx(l7, { id: "props", children: "Props panel." }),
-      /* @__PURE__ */ jsx(l7, { id: "events", children: "Events panel." }),
-      /* @__PURE__ */ jsx(l7, { id: "snapshot", children: "Snapshot panel." })
+      /* @__PURE__ */ jsx(l6, { id: "props", children: "Props panel." }),
+      /* @__PURE__ */ jsx(l6, { id: "events", children: "Events panel." }),
+      /* @__PURE__ */ jsx(l6, { id: "snapshot", children: "Snapshot panel." })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "Keycaps", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
       /* @__PURE__ */ jsx(p, { keys: [{ label: "\u2318" }, { label: "\u21E7" }, { label: "K" }], separator: "+" }),
@@ -3025,9 +3025,9 @@ function FieldsAndPickers() {
   const [paint, setPaint] = useState({ fill: "solid", color: "#b08adb" });
   return /* @__PURE__ */ jsxs(Section, { title: "Fields & pickers", children: [
     /* @__PURE__ */ jsxs(Cell, { label: "Input", children: [
-      /* @__PURE__ */ jsx(u4, { label: "Name", placeholder: "e.g. Pico" }),
+      /* @__PURE__ */ jsx(u3, { label: "Name", placeholder: "e.g. Pico" }),
       /* @__PURE__ */ jsx(
-        u4,
+        u3,
         {
           label: "Size",
           leadingAdornment: /* @__PURE__ */ jsx("span", { children: "W" }),
@@ -3035,12 +3035,12 @@ function FieldsAndPickers() {
           defaultValue: "120"
         }
       ),
-      /* @__PURE__ */ jsx(u4, { label: "Required", isInvalid: true, errorMessage: "Name is required." })
+      /* @__PURE__ */ jsx(u3, { label: "Required", isInvalid: true, errorMessage: "Name is required." })
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "NumberField, Select, ComboBox", children: [
-      /* @__PURE__ */ jsx(g, { label: "Opacity", minValue: 0, maxValue: 100, step: 5, defaultValue: 80 }),
+      /* @__PURE__ */ jsx(y, { label: "Opacity", minValue: 0, maxValue: 100, step: 5, defaultValue: 80 }),
       /* @__PURE__ */ jsx(
-        T2,
+        E2,
         {
           label: "Color",
           defaultSelectedKey: "g",
@@ -3064,9 +3064,9 @@ function FieldsAndPickers() {
       )
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "RangeSlider, Slider", children: [
-      /* @__PURE__ */ jsx(l8, { label: "Range", defaultValue: [20, 80], minValue: 0, maxValue: 100 }),
+      /* @__PURE__ */ jsx(l7, { label: "Range", defaultValue: [20, 80], minValue: 0, maxValue: 100 }),
       /* @__PURE__ */ jsx(
-        l8,
+        l7,
         {
           label: "Opacity",
           defaultValue: 75,
@@ -3076,7 +3076,7 @@ function FieldsAndPickers() {
         }
       ),
       /* @__PURE__ */ jsx(
-        b,
+        S,
         {
           ariaLabel: "Pair",
           min: 0,
@@ -3091,7 +3091,7 @@ function FieldsAndPickers() {
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "DetentSlider, InlineRange", children: [
       /* @__PURE__ */ jsx(
-        c6,
+        c7,
         {
           items: [0.25, 0.5, 1, 2, 4],
           value: rate,
@@ -3113,11 +3113,11 @@ function FieldsAndPickers() {
       )
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "ColorField, GradientEditor", children: [
-      /* @__PURE__ */ jsx(l4, { value: color, alpha: true, onInput: setColor, onChange: setColor, "aria-label": "Color" }),
-      /* @__PURE__ */ jsx(C, { value: gradient, onInput: setGradient, onChange: setGradient, kindSwitch: true })
+      /* @__PURE__ */ jsx(f3, { value: color, alpha: true, onInput: setColor, onChange: setColor, "aria-label": "Color" }),
+      /* @__PURE__ */ jsx(D, { value: gradient, onInput: setGradient, onChange: setGradient, kindSwitch: true })
     ] }),
     /* @__PURE__ */ jsx(Cell, { label: "PaintInput", children: /* @__PURE__ */ jsx(
-      S,
+      T,
       {
         value: paint,
         onInput: setPaint,
@@ -3146,9 +3146,9 @@ function PanelsAndRows() {
   ]);
   const [panelCollapsed, setPanelCollapsed] = useState(false);
   return /* @__PURE__ */ jsxs(Section, { title: "Panels & property rows", children: [
-    /* @__PURE__ */ jsx(Cell, { label: "PropertyPanel", children: /* @__PURE__ */ jsx(ae, { title: "Shape", children: /* @__PURE__ */ jsxs(oe2, { children: [
+    /* @__PURE__ */ jsx(Cell, { label: "PropertyPanel", children: /* @__PURE__ */ jsx(re2, { title: "Shape", children: /* @__PURE__ */ jsxs(ie2, { children: [
       /* @__PURE__ */ jsx(
-        B,
+        R,
         {
           kind: "number",
           control: "slider",
@@ -3161,7 +3161,7 @@ function PanelsAndRows() {
         }
       ),
       /* @__PURE__ */ jsx(
-        B,
+        R,
         {
           kind: "number",
           control: "slider",
@@ -3174,7 +3174,7 @@ function PanelsAndRows() {
         }
       ),
       /* @__PURE__ */ jsx(
-        B,
+        R,
         {
           kind: "color",
           label: "Fill",
@@ -3184,10 +3184,21 @@ function PanelsAndRows() {
           onAlphaChange: setAlpha
         }
       ),
-      /* @__PURE__ */ jsx(B, { kind: "color", label: "Stroke", value: stroke, onChange: setStroke }),
-      /* @__PURE__ */ jsx(B, { kind: "number", label: "Count", value: count, min: 0, max: 100, step: 1, onChange: setCount }),
+      /* @__PURE__ */ jsx(R, { kind: "color", label: "Stroke", value: stroke, onChange: setStroke }),
+      /* @__PURE__ */ jsx(
+        R,
+        {
+          kind: "number",
+          label: "Count",
+          value: count,
+          min: 0,
+          max: 100,
+          step: 1,
+          onChange: setCount
+        }
+      ),
       /* @__PURE__ */ jsx(
-        B,
+        R,
         {
           kind: "enum",
           label: "Line cap",
@@ -3200,7 +3211,7 @@ function PanelsAndRows() {
         }
       ),
       /* @__PURE__ */ jsx(
-        B,
+        R,
         {
           kind: "enum",
           control: "toggle",
@@ -3214,13 +3225,25 @@ function PanelsAndRows() {
           ]
         }
       ),
-      /* @__PURE__ */ jsx(B, { kind: "string", label: "Label", value: label, onChange: setLabel }),
-      /* @__PURE__ */ jsx(B, { kind: "boolean", label: "Visible", value: visible, onChange: setVisible }),
-      /* @__PURE__ */ jsx(b2, { title: "Bevel", defaultCollapsed: true, children: /* @__PURE__ */ jsx(B, { kind: "number", control: "slider", label: "Rings", value: 32, min: 4, max: 96, step: 1, onChange: () => {
-      } }) })
+      /* @__PURE__ */ jsx(R, { kind: "string", label: "Label", value: label, onChange: setLabel }),
+      /* @__PURE__ */ jsx(R, { kind: "boolean", label: "Visible", value: visible, onChange: setVisible }),
+      /* @__PURE__ */ jsx(b2, { title: "Bevel", defaultCollapsed: true, children: /* @__PURE__ */ jsx(
+        R,
+        {
+          kind: "number",
+          control: "slider",
+          label: "Rings",
+          value: 32,
+          min: 4,
+          max: 96,
+          step: 1,
+          onChange: () => {
+          }
+        }
+      ) })
     ] }) }) }),
     /* @__PURE__ */ jsx(Cell, { label: "PrefsForm", children: /* @__PURE__ */ jsx(
-      A2,
+      j,
       {
         schema: PREFS,
         values: prefs,
@@ -3228,10 +3251,10 @@ function PanelsAndRows() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "LayerList", children: /* @__PURE__ */ jsx(
-      D,
+      E3,
       {
         items: layers,
-        onReorder: (move) => setLayers(S2(layers, move)),
+        onReorder: (move) => setLayers(x3(layers, move)),
         renderBody: (item) => /* @__PURE__ */ jsxs("div", { children: [
           "settings for ",
           item.label
@@ -3239,7 +3262,7 @@ function PanelsAndRows() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "Sidebar, SidebarPanel", children: /* @__PURE__ */ jsx("div", { className: "lk-specimen__box", children: /* @__PURE__ */ jsx(n6, { side: "right", ariaLabel: "Specimen sidebar", children: /* @__PURE__ */ jsx(
-      s5,
+      a11,
       {
         title: "Selection",
         collapsed: panelCollapsed,
@@ -3255,7 +3278,7 @@ function OverlaysAndFeedback() {
   const calloutAnchor = useRef(null);
   const [calloutOpen, setCalloutOpen] = useState(false);
   const [dialogOpen, setDialogOpen] = useState(false);
-  const toasts = useMemo(() => m4(), []);
+  const toasts = useMemo(() => m3(), []);
   return /* @__PURE__ */ jsxs(Section, { title: "Overlays & feedback", children: [
     /* @__PURE__ */ jsx(Cell, { label: "Tooltip, Callout, Dialog, Toast", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
       /* @__PURE__ */ jsxs(l2, { children: [
@@ -3264,7 +3287,7 @@ function OverlaysAndFeedback() {
       ] }),
       /* @__PURE__ */ jsx("button", { type: "button", ref: calloutAnchor, onClick: () => setCalloutOpen(true), children: "Callout" }),
       /* @__PURE__ */ jsx(
-        g2,
+        _2,
         {
           triggerRef: calloutAnchor,
           isOpen: calloutOpen,
@@ -3276,7 +3299,7 @@ function OverlaysAndFeedback() {
       ),
       /* @__PURE__ */ jsx(c, { onClick: () => setDialogOpen(true), children: "Dialog" }),
       /* @__PURE__ */ jsx(
-        u3,
+        d2,
         {
           isOpen: dialogOpen,
           onOpenChange: setDialogOpen,
@@ -3292,7 +3315,7 @@ function OverlaysAndFeedback() {
           children: "Toast"
         }
       ),
-      /* @__PURE__ */ jsx(S4, { queue: toasts, placement: "bottom-right" })
+      /* @__PURE__ */ jsx(S3, { queue: toasts, placement: "bottom-right" })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "Powerline", children: /* @__PURE__ */ jsx(
       r4,
@@ -3349,7 +3372,7 @@ function ToolChrome() {
   const [paneWidth, setPaneWidth] = useState(160);
   return /* @__PURE__ */ jsxs(Section, { title: "Tool chrome", children: [
     /* @__PURE__ */ jsx(Cell, { label: "ToolGroup, ToolButton", children: /* @__PURE__ */ jsx(n8, { orientation: "horizontal", ariaLabel: "Tools", children: ["select", "rect", "ellipse"].map((id) => /* @__PURE__ */ jsx(
-      o3,
+      o4,
       {
         icon: /* @__PURE__ */ jsx(Dot, {}),
         label: id,
@@ -3360,14 +3383,14 @@ function ToolChrome() {
       },
       id
     )) }) }),
-    /* @__PURE__ */ jsx(Cell, { label: "ToolOptionsBar", children: /* @__PURE__ */ jsxs(c3, { label: "Text", children: [
+    /* @__PURE__ */ jsx(Cell, { label: "ToolOptionsBar", children: /* @__PURE__ */ jsxs(c4, { label: "Text", children: [
       /* @__PURE__ */ jsx(c, { size: "sm", variant: "ghost", iconOnly: true, ariaLabel: "Bold", children: "B" }),
       /* @__PURE__ */ jsx(c, { size: "sm", variant: "ghost", iconOnly: true, ariaLabel: "Italic", children: "I" })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "ResizeHandle", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__box", children: [
       /* @__PURE__ */ jsx("div", { className: "lk-specimen__box-main", children: "content" }),
       /* @__PURE__ */ jsx(
-        c4,
+        c5,
         {
           value: paneWidth,
           min: 100,
@@ -3476,7 +3499,7 @@ function EditorsAndPlots() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "BandEditor", wide: true, children: /* @__PURE__ */ jsx(
-      k,
+      j2,
       {
         min: 1 / 64,
         max: 1 / 2,
@@ -3486,12 +3509,12 @@ function EditorsAndPlots() {
         onChange: setBands,
         selectedIndex: band,
         onSelect: setBand,
-        renderBand: (b3) => b3.data.name,
+        renderBand: (b2) => b2.data.name,
         ticks: [1 / 24, 1 / 12, 1 / 6].map((at) => ({ at, label: `1/${Math.round(1 / at)}` }))
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "Timeline", wide: true, children: /* @__PURE__ */ jsx("div", { className: "lk-specimen__timeline", children: /* @__PURE__ */ jsx(
-      $2,
+      ye,
       {
         tracks,
         duration: 2e3,
@@ -3554,6 +3577,6 @@ function Specimen({ className }) {
   ] });
 }
 
-export { ANNOTATION_TOOLS, ANNOTATION_WEASEL_TOOLS, AnnotationOverlay, AnnotationTargets, Lab, LabBoundary, LabPalette, LabRoot, LabShell, LabSwitcher, SPECIMEN_SECTIONS, Specimen, Trial, TrialBody, TrialChrome, Workspace, addTrial, annotationToolInfo, annotationsFromJSON, capturePlan, captureTarget, cloneTrial, closeTrial, composeCaptureSvg, createAnnotationScene, createAnnotationStore, createMarkDrawOne, currentPage, defineInstrument, fitView, fracContains, fracEncloses, fracToWorld, fromWeaselView, interstellarTheme, isStale, markCommands, markSvgNodes, reorderTrials, resetTrial, resolveMarkStyle, roundFrac, seenFrom, toWeaselView, validateConfigSchema, worldToFrac };
+export { AnnotationOverlay, AnnotationTargets, Lab, LabBoundary, LabPalette, LabRoot, LabShell, LabSwitcher, LabZoom, SPECIMEN_SECTIONS, Specimen, Trial, TrialBody, TrialChrome, Workspace, addTrial, annotationsFromJSON, capturePlan, captureTarget, cloneTrial, closeTrial, composeCaptureSvg, createAnnotationScene, createAnnotationStore, createMarkDrawOne, currentPage, defineInstrument, fitView, fracContains, fracEncloses, fracToWorld, fromWeaselView, interstellarTheme, isStale, reorderTrials, resetTrial, resolveMarkStyle, roundFrac, seenFrom, toWeaselView, validateConfigSchema, worldToFrac };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map