@weasel-js/labkit 1.7.0 → 1.7.1

package/dist/index.js

@@ -1,66 +1,67 @@
-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 { LoupeSwitchContext } from './chunk-2ES4W47N.js';
+export { LoupeSwitchContext } from './chunk-2ES4W47N.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-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 { 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 { useDragDrop, DragOverlay, Palette } from './chunk-2N7UBSS2.js';
+import { useTiledSurface } from './chunk-EESJUSYR.js';
+export { composeRects, toDeviceRect, useTiledSurface } from './chunk-EESJUSYR.js';
+import { useJob } from './chunk-EFXRM6XQ.js';
+export { useJob } from './chunk-EFXRM6XQ.js';
+import { markCommands, boundsOf, roundFrac, worldToFrac, fracToWorld, fracEncloses, fracContains, POINT_MARK_SHAPE, roundPoints, fromShape, markSvgNodes, toShape } from './chunk-F4ACIK7Z.js';
+export { fracContains, fracEncloses, fracToWorld, markCommands, markSvgNodes, roundFrac, worldToFrac } from './chunk-F4ACIK7Z.js';
+import { ANNOTATION_WEASEL_TOOLS, annotationToolInfo, suppressContributions, mergeContributions, builtinContributions, TRANSIENT_BUILTINS, TitleBarRegion, ToolbarRegion, PaletteRegion, ViewportRegion, SidebarRegion, StatusRegion, resolveLabTool, useLabChromeContext, labContributions, labAnnotationTools, LabHeaderRegion, LabFooterRegion, LabAsideRegion, LabSidebarRegion } from './chunk-GAHELLJT.js';
+export { ANNOTATION_TOOLS, ANNOTATION_WEASEL_TOOLS, ExportMenu, LabAsideRegion, LabFooterRegion, LabHeaderRegion, LabSidebarRegion, MarkList, PaletteRegion, SidebarRegion, StatusRegion, TRANSIENT_BUILTINS, TitleBarRegion, ToolbarRegion, ViewportRegion, annotationToolInfo, builtinContributions, contributionsIn, labContributions, mergeContributions, suppressContributions, toolContributions, useLabChromeContext } from './chunk-GAHELLJT.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 { Split, JobProgress, Legend } from './chunk-FB4MIZOO.js';
+export { JobProgress, Legend, Readout, Split } from './chunk-FB4MIZOO.js';
+import { FloatingPanel } from './chunk-XE5HJOPL.js';
+export { FloatingPanel } from './chunk-XE5HJOPL.js';
+import { Toolbar, StatusBar, ScaleIndicator, ZoomControl } from './chunk-CEGFXTBD.js';
+export { FpsMeter, ScaleIndicator, StatusBar, Toolbar, ZoomControl } from './chunk-CEGFXTBD.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, inDialog, summarizeValue } from './chunk-T5IBSPAM.js';
-import { useConfigSchema } from './chunk-GOZLNM4L.js';
-export { sectionTree, useConfigSchema } from './chunk-GOZLNM4L.js';
+import { unruledConfigSchema, createLabStore, openLabStore, panelKey } from './chunk-IBVRMHW5.js';
+export { CURRENT_DOCUMENT_VERSION, dockPanel, labDocumentKey, openLabStore, panelKey, quarantineKey, undockPanel, useTrialState } from './chunk-IBVRMHW5.js';
+import { newId, useWarnIgnoredChange, useOpenOnce, PersistenceContext, createRecordCache, noneAdapter, defaultStorage, usePersistedState } from './chunk-PMLZP7RT.js';
+export { Persistence, createIndexedDbAdapter, createMemoryAdapter, indexedDbAdapter, localStorageAdapter, noneAdapter, sessionStorageAdapter, urlHashAdapter, usePersistedState } from './chunk-PMLZP7RT.js';
+export { ControlPanel, inDialog, summarizeValue } from './chunk-JFOJESJF.js';
+import { useConfigSchema } from './chunk-E6NARGU7.js';
+export { sectionTree, useConfigSchema } from './chunk-E6NARGU7.js';
 import { useLabContext, LabContext } from './chunk-Z76KEZAX.js';
 export { LabContext, useLabContext } from './chunk-Z76KEZAX.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 { useResolvedConfig } from './chunk-YCFKW5RX.js';
+export { BaseNode, BooleanNode, ColorNode, CustomNode, EnumNode, GroupNode, ListNode, NumberNode, StringNode, ValueNode, applyRules, builtinRules, f, isConfigBranch, resolveConfigSchema, titleCase, useResolvedConfig } from './chunk-YCFKW5RX.js';
+export { fromConfigFields, isLeafVisible } from './chunk-WLMDTI2Q.js';
+import { hasConfigPath, schemaNodeAtPath, applyConfigWrite, resolveAutoConfig, isAuto, isRecord, autoPathsOf, fillConfigDefaults } from './chunk-READTDQX.js';
+export { auto, autoPathsOf, fillConfigDefaults, hasConfigPath, isAuto, resolveAutoConfig, schemaNodeAtPath, valueAtPath, withValueAtPath } from './chunk-READTDQX.js';
+import { CanvasStack, Stage, fitStage } from './chunk-T6DLGEJB.js';
+export { CanvasStack, Stage, fitStage } from './chunk-T6DLGEJB.js';
+export { centerOn, zoomAt } from './chunk-ROGJWDQA.js';
+export { screenToWorld, worldToScreen } from './chunk-FG3EXZDV.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 { CameraWheelContext, as2DView, CameraRegistryContext, DEFAULT_VIEW, CameraPublishContext, createCameraRegistry, withZoom } from './chunk-VYVGVBGY.js';
+export { CameraContext, CameraInput, CameraPublishContext, CameraRegistryContext, CameraScope, DEFAULT_VIEW, as2DView, createCameraRegistry, usePublishCamera } from './chunk-VYVGVBGY.js';
+import { applyCamera } from './chunk-ULYYNWGP.js';
+export { DEFAULT_FRAME, applyCamera, resolveFrame } from './chunk-ULYYNWGP.js';
+import { CanvasStackContext } from './chunk-ZQIHJXP4.js';
+export { CanvasStackContext } from './chunk-ZQIHJXP4.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 { 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 { D2, S2, X, U, G, p4, o3, c, Xt, c5, a7, l4, u3, a6, r3, a9, i2, o5, s3, c6, l8, p, f2, u2, y, O2, b4, l9, S, c7, i4, h2, j, k2, oe, se, R, b3, j2, n6, a10, C3, l2, u, v2, d3, j3, r4, n7, r5, i5, p2, f, n8, o4, c4, l7, w, L, n9, j4, be, n2 } from './chunk-4KSC7NXL.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, u2 as Input, l10 as Jog, D2 as LayerList, re as PauseIcon, ne as PlayIcon, z2 as PropertyControl, R as PropertyField, b3 as PropertyGroup, se as PropertyList, oe as PropertyPanel, F2 as PropertyRow, ce as PropertySpan, B as ResetIcon, O2 as Select, ae as StepBackIcon, $ as StepForwardIcon, ie as StopIcon, x2 as Subpanel, a6 as ToggleBar, oe2 as TokenPanel, H2 as inferTokenType, S2 as moveLayers, O3 as refitScale } from './chunk-4KSC7NXL.js';
+import { serializeSvg } from './chunk-E23Q6A3Y.js';
+import './chunk-XVUKDSYV.js';
+import { makeViewportZoomAction, createScene, asNodeId as asNodeId$1, registerNodeShape, useLatest, WeaselProvider, SceneCanvas, createPointerStore, PointerContextProvider, DepRegistryProvider, ActionsProvider, ActiveToolContextProvider, useActionsRegistry, useDepSource, ActionDisabledReason, useGestureDispatcher, sceneFromJSON, warmRender, renderSceneToPixels, useActiveToolContext } from '@weasel-js/core';
+import { createContext, useState, useRef, useEffect, useInsertionEffect, useCallback, useContext, useMemo, useSyncExternalStore, useLayoutEffect, useId, Children } 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';
 import { useResolvedColorMode, useThemeOptional, ThemeProvider, ThemeContext } from '@weasel-js/theme/react';
 import { useStore } from 'zustand/react';
 import { Provider, StrategyRegistryProvider, DragProvider, Container, useDragHandle } from 'windease/react';
-import { asNodeId, Store, createNode, floatingStrategy, gridStrategy } from 'windease';
+import { asNodeId, createNode, floatingStrategy, gridStrategy, Store } from 'windease';
 import { Focusable } from 'react-aria-components';
 
 // src/annotations/staleness.ts
@@ -68,8 +69,8 @@ function seenFrom(config, keys) {
   const out = {};
   if (config === null || typeof config !== "object") return out;
   const src = config;
-  for (const k of keys) {
-    if (k in src) out[k] = src[k];
+  for (const k2 of keys) {
+    if (k2 in src) out[k2] = src[k2];
   }
   return out;
 }
@@ -77,16 +78,16 @@ 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 k of keys) {
-    if (!(k in seen)) continue;
-    if (!Object.is(seen[k], src[k])) return true;
+  for (const k2 of keys) {
+    if (!(k2 in seen)) continue;
+    if (!Object.is(seen[k2], src[k2])) return true;
   }
   return false;
 }
 
 // src/annotations/drawOne.ts
 function createMarkDrawOne(opts) {
-  return (node, pose) => markCommands({ pose, data: node.data }, opts.content, resolveMarkStyle(node.data, opts));
+  return (node, pose, view) => markCommands({ pose, data: node.data }, resolveMarkStyle(node.data, opts), view.scale);
 }
 function resolveMarkStyle(data, opts) {
   return {
@@ -103,7 +104,7 @@ function capturePlan(base, format) {
   if (format === "svg") return "svg-document";
   return base?.kind === "svg" ? "svg-document" : "raster-stack";
 }
-function nestBaseSvg(markup, w2, h) {
+function nestBaseSvg(markup, w2, h2) {
   const doc = new DOMParser().parseFromString(markup, "image/svg+xml");
   const root = doc.documentElement;
   if (doc.getElementsByTagName("parsererror").length > 0 || root.localName !== "svg") {
@@ -112,40 +113,40 @@ function nestBaseSvg(markup, w2, h) {
   root.setAttribute("x", "0");
   root.setAttribute("y", "0");
   root.setAttribute("width", String(w2));
-  root.setAttribute("height", String(h));
+  root.setAttribute("height", String(h2));
   return new XMLSerializer().serializeToString(root);
 }
-function embedRasterBase(base, w2, h, onWarn) {
+function embedRasterBase(base, w2, h2, onWarn) {
   const href = base.kind === "canvas" ? base.canvas.toDataURL() : base.kind === "image" ? base.src : "";
   if (base.kind === "image" && !href.startsWith("data:")) {
     onWarn?.(`base image '${href}' is a reference, so this SVG is not self-contained`);
   }
-  return serializeSvg([{ kind: "image", href, x: 0, y: 0, width: w2, height: h }], {
-    viewBox: { x: 0, y: 0, width: w2, height: h }
+  return serializeSvg([{ kind: "image", href, x: 0, y: 0, width: w2, height: h2 }], {
+    viewBox: { x: 0, y: 0, width: w2, height: h2 }
   });
 }
-function markNodesOf(scene, draw) {
+function markNodesOf(scene, draw, scale) {
   return [...scene.renderOrder()].flatMap((id) => {
     const node = scene.get(asNodeId$1(String(id)));
     if (!node) return [];
     return markSvgNodes(
       { pose: node.pose, data: node.data },
-      draw.content,
-      resolveMarkStyle(node.data, draw)
+      resolveMarkStyle(node.data, draw),
+      { x: scale, y: scale }
     );
   });
 }
 function composeCaptureSvg(args) {
   const { base, scene, draw, scale, onWarn } = args;
-  const { w: w2, h } = draw.content;
-  const baseXml = base === void 0 ? "" : base.kind === "svg" ? nestBaseSvg(base.markup, w2, h) : embedRasterBase(base, w2, h, onWarn);
-  const marksXml = serializeSvg(markNodesOf(scene, draw), {
-    viewBox: { x: 0, y: 0, width: w2, height: h },
+  const { w: w2, h: h2 } = draw.content;
+  const baseXml = base === void 0 ? "" : base.kind === "svg" ? nestBaseSvg(base.markup, w2, h2) : embedRasterBase(base, w2, h2, onWarn);
+  const marksXml = serializeSvg(markNodesOf(scene, draw, scale), {
+    viewBox: { x: 0, y: 0, width: w2, height: h2 },
     onWarn
   });
   const outW = Math.max(1, Math.round(w2 * scale));
-  const outH = Math.max(1, Math.round(h * scale));
-  return `<svg xmlns="${SVG_NS}" width="${outW}" height="${outH}" viewBox="0 0 ${w2} ${h}">${baseXml}${marksXml}</svg>`;
+  const outH = Math.max(1, Math.round(h2 * scale));
+  return `<svg xmlns="${SVG_NS}" width="${outW}" height="${outH}" viewBox="0 0 ${w2} ${h2}">${baseXml}${marksXml}</svg>`;
 }
 function context2d(width, height) {
   const canvas = document.createElement("canvas");
@@ -195,12 +196,14 @@ async function stackRaster(args) {
   const ctx = context2d(width, height);
   if (base?.kind === "image") ctx.drawImage(await loadImage(base.src), 0, 0, width, height);
   else if (base?.kind === "canvas") ctx.drawImage(base.canvas, 0, 0, width, height);
-  const raster = renderSceneToPixels({
+  const render = {
     scene,
     sourceRect: { x: 0, y: 0, width: draw.content.w, height: draw.content.h },
     scale: { x: scale, y: scale },
     drawOne: createMarkDrawOne(draw)
-  });
+  };
+  await warmRender({ render });
+  const raster = renderSceneToPixels(render);
   const marks = context2d(raster.width, raster.height);
   marks.putImageData(
     new ImageData(Uint8ClampedArray.from(raster.data), raster.width, raster.height),
@@ -238,36 +241,6 @@ async function captureTarget(args, opts = {}) {
   return { target: args.target, blob, format, width, height };
 }
 
-// src/annotations/frac.ts
-function fracToWorld(f5, content) {
-  return {
-    x: f5.x * content.w,
-    y: f5.y * content.h,
-    width: f5.w * content.w,
-    height: f5.h * content.h
-  };
-}
-function worldToFrac(r4, content) {
-  const sx = content.w === 0 ? 0 : 1 / content.w;
-  const sy = content.h === 0 ? 0 : 1 / content.h;
-  return { x: r4.x * sx, y: r4.y * sy, w: r4.width * sx, h: r4.height * sy };
-}
-var DP = 1e4;
-function roundFrac(f5) {
-  return {
-    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) {
-  return pt.x >= box.x - tol && pt.x <= box.x + box.w + tol && pt.y >= box.y - tol && pt.y <= box.y + box.h + tol;
-}
-function fracEncloses(outer, inner) {
-  return inner.x >= outer.x && inner.y >= outer.y && inner.x + inner.w <= outer.x + outer.w && inner.y + inner.h <= outer.y + outer.h;
-}
-
 // src/annotations/history.ts
 var MarkHistory = class {
   depth = /* @__PURE__ */ new Map();
@@ -349,6 +322,19 @@ function createAnnotationScene() {
   return createScene({ systemLayers: [{ id: "marks" }] });
 }
 var NO_CONTENT = { w: 0, h: 0 };
+function shapeFor(kind, points, frac) {
+  if (!points || kind === "point") return void 0;
+  return roundPoints(toShape(points, frac));
+}
+function migrateLegacyPoints(raw, content) {
+  const nodes = raw.nodes.map((n6) => {
+    const { points, ...data } = n6.data;
+    if (!points || data.shape) return n6;
+    const shape = shapeFor(data.kind, points, worldToFrac(n6.pose, content));
+    return { ...n6, data: { ...data, ...shape ? { shape } : {} } };
+  });
+  return { ...raw, nodes };
+}
 function splitId(id) {
   const at = id.lastIndexOf("/");
   return at <= 0 ? void 0 : { target: id.slice(0, at), node: id.slice(at + 1) };
@@ -361,26 +347,63 @@ function createAnnotationStore(opts) {
   const notify = () => {
     for (const fn of subs) fn();
   };
+  let holding = 0;
+  let heldDirty = false;
+  const hold = (fn) => {
+    holding += 1;
+    try {
+      fn();
+    } finally {
+      holding -= 1;
+    }
+    if (holding === 0 && heldDirty) {
+      heldDirty = false;
+      notify();
+    }
+  };
+  const exclusive = () => (typeof opts.selection === "function" ? opts.selection() : opts.selection) !== "per-target";
+  const lastSelection = /* @__PURE__ */ new Map();
+  const selectionKey = (scene) => scene.getSelection().map(String).join(" ");
+  const clearOthers = (keep) => {
+    for (const [target, scene] of scenes) {
+      if (target !== keep && scene.getSelection().length > 0) scene.setSelection([]);
+    }
+  };
+  const targetOf = (id) => targets().find((t) => t.id === id);
+  const contentOf = (id) => targetOf(id)?.content ?? NO_CONTENT;
   const sceneFor = (target) => {
     const known = scenes.get(target);
     if (known) return known;
     const raw = restore?.[target];
     const scene = raw ? sceneFromJSON(
-      raw,
+      migrateLegacyPoints(raw, contentOf(target)),
       {}
     ) : createAnnotationScene();
     scenes.set(target, scene);
     history.track(target, scene);
+    lastSelection.set(target, selectionKey(scene));
     scene.subscribe(() => {
       history.observe(target, scene);
-      notify();
+      const selected = selectionKey(scene);
+      const newlySelected = selected !== "" && selected !== lastSelection.get(target);
+      lastSelection.set(target, selected);
+      if (holding > 0) {
+        heldDirty = true;
+        return;
+      }
+      if (newlySelected && exclusive()) {
+        hold(() => {
+          heldDirty = true;
+          clearOthers(target);
+        });
+      } else {
+        notify();
+      }
     });
     return scene;
   };
   const historySceneAt = (target) => scenes.get(target);
   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,
@@ -390,12 +413,10 @@ function createAnnotationStore(opts) {
   const project = (target, node) => {
     const found = scenes.get(target)?.get(asNodeId$1(node));
     if (!found) return void 0;
-    return {
-      ...found.data,
-      target,
-      id: `${target}/${node}`,
-      frac: roundFrac(worldToFrac(found.pose, contentOf(target)))
-    };
+    const { shape, ...data } = found.data;
+    const frac = roundFrac(worldToFrac(found.pose, contentOf(target)));
+    const points = data.kind === "point" ? [{ x: frac.x, y: frac.y }] : shape && roundPoints(fromShape(shape, frac));
+    return { ...data, target, id: `${target}/${node}`, frac, ...points ? { points } : {} };
   };
   const liveTargets = () => {
     const declared = targets().map((t) => t.id);
@@ -476,20 +497,24 @@ function createAnnotationStore(opts) {
     },
     setSelection(ids) {
       const wanted = /* @__PURE__ */ new Map();
+      const only = exclusive();
       for (const id of ids) {
         const found = nodeOf(id);
         if (!found) continue;
+        if (only && wanted.size > 0 && !wanted.has(found.target)) continue;
         const node = String(found.node.id);
         const on = wanted.get(found.target);
         if (!on) wanted.set(found.target, [node]);
         else if (!on.includes(node)) on.push(node);
       }
-      for (const [target, scene] of scenes) {
-        const next = wanted.get(target) ?? [];
-        const now = scene.getSelection();
-        if (now.length === next.length && next.every((n6, i5) => String(now[i5]) === n6)) continue;
-        scene.setSelection(next.map(asNodeId$1));
-      }
+      hold(() => {
+        for (const [target, scene] of scenes) {
+          const next = wanted.get(target) ?? [];
+          const now = scene.getSelection();
+          if (now.length === next.length && next.every((n6, i5) => String(now[i5]) === n6)) continue;
+          scene.setSelection(next.map(asNodeId$1));
+        }
+      });
     },
     subscribe(fn) {
       subs.add(fn);
@@ -499,10 +524,12 @@ function createAnnotationStore(opts) {
     },
     add(init, config) {
       const target = targetOf(init.target);
+      const frac = roundFrac(init.frac);
+      const shape = shapeFor(init.kind, init.points, frac);
       const data = {
         target: init.target,
         kind: init.kind,
-        ...init.points ? { points: init.points } : {},
+        ...shape ? { shape } : {},
         ...init.title !== void 0 ? { title: init.title } : {},
         ...init.status !== void 0 ? { status: init.status } : {},
         ...init.tags !== void 0 ? { tags: init.tags } : {},
@@ -512,7 +539,7 @@ function createAnnotationStore(opts) {
       const node = sceneFor(init.target).add({
         kind: "leaf",
         layer: "marks",
-        pose: fracToWorld(roundFrac(init.frac), target?.content ?? NO_CONTENT),
+        pose: fracToWorld(frac, target?.content ?? NO_CONTENT),
         data
       });
       return `${init.target}/${String(node)}`;
@@ -520,14 +547,18 @@ function createAnnotationStore(opts) {
     update(id, patch) {
       const found = nodeOf(id);
       if (!found) return;
-      const { frac, ...meaning } = patch;
+      const { frac: fracPatch, points, ...meaning } = patch;
       const nid = asNodeId$1(found.node.id);
-      if (Object.keys(meaning).length > 0) {
-        found.scene.update(nid, { data: { ...found.node.data, ...meaning } });
-      }
-      if (frac) {
-        found.scene.setPose(nid, fracToWorld(roundFrac(frac), contentOf(found.target)));
+      const content = contentOf(found.target);
+      const frac = fracPatch ?? (points ? boundsOf(points) : null);
+      const bounds = roundFrac(frac ?? worldToFrac(found.node.pose, content));
+      const shape = points ? shapeFor(found.node.data.kind, points, bounds) : void 0;
+      if (Object.keys(meaning).length > 0 || shape) {
+        found.scene.update(nid, {
+          data: { ...found.node.data, ...meaning, ...shape ? { shape } : {} }
+        });
       }
+      if (frac) found.scene.setPose(nid, fracToWorld(bounds, content));
     },
     setMeta(id, meta) {
       const found = nodeOf(id);
@@ -582,17 +613,17 @@ function annotationsFromJSON(raw, targets, rest = {}) {
 }
 
 // src/annotations/view.ts
-function toWeaselView(v) {
-  return { x: v.pan.x, y: v.pan.y, scale: { x: v.zoom, y: v.zoom } };
+function toWeaselView(v2) {
+  return { x: v2.pan.x, y: v2.pan.y, scale: { x: v2.zoom, y: v2.zoom } };
 }
-function fromWeaselView(v) {
-  return { zoom: v.scale.x, pan: { x: v.x, y: v.y } };
+function fromWeaselView(v2) {
+  return { zoom: v2.scale.x, pan: { x: v2.x, y: v2.y } };
 }
 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 = (a6, b2) => a6 !== null && a6.x === b2.x && a6.y === b2.y && a6.w === b2.w && a6.h === b2.h;
+var sameRect = (a6, b3) => a6 !== null && a6.x === b3.x && a6.y === b3.y && a6.w === b3.w && a6.h === b3.h;
 function ToolBridge({ toolId }) {
   const tools = useActiveToolContext();
   const setActive = tools.setActive;
@@ -601,19 +632,24 @@ function ToolBridge({ toolId }) {
   }, [toolId, setActive]);
   return null;
 }
-function pointsOf(extras, content) {
-  const toFrac = (p3) => ({
-    x: content.w === 0 ? 0 : p3.x / content.w,
-    y: content.h === 0 ? 0 : p3.y / content.h
-  });
-  if (extras.kind === "line") {
-    return [toFrac(extras.a), toFrac(extras.b)];
-  }
+function verticesOf(extras) {
+  if (extras.kind === "line") return [extras.a, extras.b];
   if (extras.kind === "pencil") {
-    return extras.samples.map(toFrac);
+    const samples = extras.samples;
+    return samples.length > 0 ? samples : void 0;
   }
   return void 0;
 }
+function insertedGeometry(extras) {
+  const vertices = verticesOf(extras);
+  if (!vertices) return void 0;
+  const box = boundsOf(vertices);
+  if (!box) return void 0;
+  return {
+    pose: { x: box.x, y: box.y, width: box.w, height: box.h },
+    shape: roundPoints(toShape(vertices, box))
+  };
+}
 function AnnotationOverlay({
   target,
   scene,
@@ -626,10 +662,9 @@ function AnnotationOverlay({
   const [rect, setRect] = useState(null);
   const [input, setInput] = useState(null);
   const sceneCanvas = useRef(null);
-  const toolRef = useRef(activeToolId);
-  toolRef.current = activeToolId;
-  const configRef = useRef(config);
-  configRef.current = config;
+  useEffect(() => registerNodeShape(POINT_MARK_SHAPE, { priority: "high" }), []);
+  const toolRef = useLatest(activeToolId);
+  const configRef = useLatest(config);
   const id = target.id;
   const tileId = useTileId(id);
   const lastTile = useRef(null);
@@ -647,9 +682,10 @@ function AnnotationOverlay({
     [surface, tileId]
   );
   const painted = useRef(false);
-  const canvasRef = useRef(canvas);
-  if (canvasRef.current !== canvas) painted.current = false;
-  canvasRef.current = canvas;
+  const canvasRef = useLatest(canvas);
+  useInsertionEffect(() => {
+    painted.current = false;
+  }, [canvas]);
   const unsubscribeFrame = useRef(null);
   const attachSceneCanvas = useCallback((api) => {
     sceneCanvas.current = api;
@@ -669,7 +705,7 @@ function AnnotationOverlay({
       gl.clearColor(0, 0, 0, 0);
       gl.clear(gl.COLOR_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
     });
-  }, [surface, tileId]);
+  }, [canvasRef, surface, tileId]);
   const wheelSlot = useContext(CameraWheelContext);
   useEffect(() => {
     if (!input || !wheelSlot) return;
@@ -699,14 +735,11 @@ function AnnotationOverlay({
       const info = annotationToolInfo(toolRef.current);
       const kind = info?.kind;
       if (!kind) return null;
-      const points = pointsOf(extras, target.content);
-      const data = {
-        target: id,
-        kind,
-        ...points ? { points } : {},
-        seen: seenFrom(configRef.current, target.positionDependsOn ?? [])
-      };
-      return { data };
+      const seen = seenFrom(configRef.current, target.positionDependsOn ?? []);
+      const geometry = insertedGeometry(extras);
+      if (!geometry) return { data: { target: id, kind, seen } };
+      const data = { target: id, kind, shape: geometry.shape, seen };
+      return { data, pose: geometry.pose };
     };
   }
   const box = {
@@ -1123,7 +1156,7 @@ function TrialChrome({
   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),
+    () => Object.values(undockedPanels).filter((p4) => p4.trialId === trialId).map((p4) => p4.sectionId),
     [undockedPanels, trialId]
   );
   const view2d = as2DView(record.view);
@@ -1157,6 +1190,7 @@ function TrialChrome({
       canRedo: undoBindings?.canRedo ?? false,
       undo: undoBindings?.undo ?? NO_OP,
       redo: undoBindings?.redo ?? NO_OP,
+      hasLoupe: loupe != null,
       loupeOn: loupe?.on ?? false,
       toggleLoupe: loupe?.toggle ?? NO_OP,
       configSchema,
@@ -1226,7 +1260,8 @@ function TrialChrome({
         [...trialChrome ?? []],
         [...chrome ?? []]
       ),
-      suppress ?? []
+      suppress ?? [],
+      TRANSIENT_BUILTINS
     ),
     [instrument, ctx, trialChrome, chrome, suppress, lab.controls]
   );
@@ -1374,7 +1409,6 @@ function TrialRuntime({
   );
   const [pointer] = useState(createPointerStore);
   const canvasContainerRef = useRef(null);
-  const loupeHostRef = useRef(null);
   const updateTrialState = useStore(store, (s2) => s2.updateTrialState);
   const updateTrialConfig = useStore(store, (s2) => s2.updateTrialConfig);
   const updateTrialView = useStore(store, (s2) => s2.updateTrialView);
@@ -1391,8 +1425,14 @@ function TrialRuntime({
   const [layerVisibility, setLayerVisibility] = useState({});
   const [layerOrder, setLayerOrder] = useState(null);
   const [loupeOn, setLoupeOn] = useState(false);
+  const [lenses, setLenses] = useState(0);
+  const mountLens = useCallback(() => {
+    setLenses((n6) => n6 + 1);
+    return () => setLenses((n6) => n6 - 1);
+  }, []);
+  const loupeSwitch = useMemo(() => ({ on: loupeOn, mount: mountLens }), [loupeOn, mountLens]);
   const visibleLayers = useMemo(
-    () => (instrument.canvas?.layers ?? []).filter((l7) => layerVisibility[l7.id] !== false).map((l7) => l7.id),
+    () => (instrument.canvas?.layers ?? []).filter((l8) => layerVisibility[l8.id] !== false).map((l8) => l8.id),
     [instrument.canvas, layerVisibility]
   );
   const undoCap = instrument.undo;
@@ -1405,7 +1445,7 @@ function TrialRuntime({
     const snap = structuredClone(current.state);
     updateTrialUndoStack(record.id, (prev) => pushSnapshot(prev, snap, maxDepth));
   };
-  const setView = (v) => updateTrialView(record.id, v);
+  const setView = (v2) => updateTrialView(record.id, v2);
   const stage = instrument.canvas ? void 0 : instrument.stage;
   const placeView = (size) => {
     const declared = instrument.canvas?.initialView ?? (stage ? stage.initialView ?? ((vp) => fitStage(stage.size, vp)) : void 0);
@@ -1414,29 +1454,48 @@ function TrialRuntime({
     setView(declared(size));
   };
   const annotationsCap = instrument.annotations;
-  const targetsRef = useRef(() => []);
-  targetsRef.current = () => annotationsCap ? annotationsCap.targets(record.state, config, { id: record.id, view: record.view }) : [];
+  const targetsRef = useLatest(
+    () => annotationsCap ? annotationsCap.targets(record.state, config, { id: record.id, view: record.view }) : []
+  );
   const annotationsRef = useRef(null);
-  const configRef = useRef(config);
-  configRef.current = config;
-  const capRef = useRef(annotationsCap);
-  capRef.current = annotationsCap;
+  const configRef = useLatest(config);
+  const capRef = useLatest(annotationsCap);
   if (annotationsRef.current === null) {
-    const kept = annotationsCap?.storage ? keptMarks : record.annotations;
-    annotationsRef.current = annotationsFromJSON(kept, () => targetsRef.current(), {
-      meaning: () => capRef.current?.meaning,
-      config: () => configRef.current,
-      onCapture: (result) => capRef.current?.onCapture?.(result)
-    });
+    annotationsRef.current = annotationsFromJSON(
+      annotationsCap?.storage ? keptMarks : record.annotations,
+      () => targetsRef.current(),
+      {
+        meaning: () => capRef.current?.meaning,
+        config: () => configRef.current,
+        onCapture: (result) => capRef.current?.onCapture?.(result),
+        selection: () => capRef.current?.selection
+      }
+    );
   }
   const annotations = annotationsRef.current;
+  const inputsCommitted = useRef(/* @__PURE__ */ new Set());
+  useLayoutEffect(() => {
+    for (const fn of inputsCommitted.current) fn();
+  }, [record.state, record.view, config, annotationsCap]);
+  const provided = useMemo(
+    () => ({
+      ...annotations,
+      subscribe: (fn) => {
+        const off = annotations.subscribe(fn);
+        inputsCommitted.current.add(fn);
+        return () => {
+          off();
+          inputsCommitted.current.delete(fn);
+        };
+      }
+    }),
+    [annotations]
+  );
   const saveCap = annotationsCap?.storage;
-  const saveRef = useRef(() => {
-  });
-  saveRef.current = (doc) => {
+  const saveRef = useLatest((doc) => {
     if (saveCap) saveCap.save(doc);
     else updateTrialAnnotations(record.id, doc);
-  };
+  });
   const [markMoves, setMarkMoves] = useState({ undo: false, redo: false });
   useEffect(() => {
     if (!annotationsCap) return;
@@ -1469,7 +1528,7 @@ function TrialRuntime({
       if (timer) clearTimeout(timer);
       flush();
     };
-  }, [annotations, annotationsCap]);
+  }, [annotations, annotationsCap, saveRef]);
   const declaresTools = instrument.tools != null;
   const labTool = resolveLabTool(labToolId, instruments);
   const resolvedToolId = declaresTools ? record.activeToolId ?? instrument.tools?.initial ?? instrument.tools?.tools[0]?.id ?? null : labTool;
@@ -1545,16 +1604,11 @@ function TrialRuntime({
       if (undoCap) redoState();
     }
   } : void 0;
-  const loupeCap = useMemo(() => {
-    const declared = instrument.loupe;
-    if (declared == null) return null;
-    return resolveLoupe(typeof declared === "function" ? declared(config) : declared);
-  }, [instrument.loupe, config]);
-  const loupeBindings = loupeCap ? { on: loupeOn, toggle: () => setLoupeOn((v) => !v) } : void 0;
+  const loupeBindings = lenses > 0 ? { on: loupeOn, toggle: () => setLoupeOn((v2) => !v2) } : void 0;
   const canvasLayers = useMemo(() => {
     if (!instrument.canvas) return [];
     const baseLayers = instrument.canvas.layers;
-    const ordered = layerOrder ? [...baseLayers].sort((a6, b2) => layerOrder.indexOf(a6.id) - layerOrder.indexOf(b2.id)) : baseLayers;
+    const ordered = layerOrder ? [...baseLayers].sort((a6, b3) => layerOrder.indexOf(a6.id) - layerOrder.indexOf(b3.id)) : baseLayers;
     return ordered.map((layer) => ({
       id: layer.id,
       visible: layerVisibility[layer.id] !== false,
@@ -1566,19 +1620,19 @@ function TrialRuntime({
   }, [instrument.canvas, record.state, config, layerVisibility, layerOrder]);
   const layerDescriptors = useMemo(() => {
     if (!instrument.layers) return [];
-    return instrument.layers.ids.map((l7) => typeof l7 === "string" ? { id: l7, label: l7 } : l7);
+    return instrument.layers.ids.map((l8) => typeof l8 === "string" ? { id: l8, label: l8 } : l8);
   }, [instrument.layers]);
   const layerItems = useMemo(() => {
-    const ordered = layerOrder ? [...layerDescriptors].sort((a6, b2) => layerOrder.indexOf(a6.id) - layerOrder.indexOf(b2.id)) : layerDescriptors;
+    const ordered = layerOrder ? [...layerDescriptors].sort((a6, b3) => layerOrder.indexOf(a6.id) - layerOrder.indexOf(b3.id)) : layerDescriptors;
     const pinnedLast = [
-      ...ordered.filter((l7) => !l7.alwaysOn),
-      ...ordered.filter((l7) => l7.alwaysOn)
+      ...ordered.filter((l8) => !l8.alwaysOn),
+      ...ordered.filter((l8) => l8.alwaysOn)
     ];
-    return pinnedLast.map((l7) => ({
-      id: l7.id,
-      label: l7.label,
-      locked: l7.alwaysOn === true,
-      visible: l7.alwaysOn === true || layerVisibility[l7.id] !== false
+    return pinnedLast.map((l8) => ({
+      id: l8.id,
+      label: l8.label,
+      locked: l8.alwaysOn === true,
+      visible: l8.alwaysOn === true || layerVisibility[l8.id] !== false
     }));
   }, [layerDescriptors, layerOrder, layerVisibility]);
   const dragDropResult = useDragDrop({
@@ -1599,8 +1653,8 @@ function TrialRuntime({
   });
   const paletteItems = useMemo(() => {
     if (!instrument.dragDrop) return [];
-    const p3 = instrument.dragDrop.palette;
-    return typeof p3 === "function" ? p3(record.state, config) : p3;
+    const p4 = instrument.dragDrop.palette;
+    return typeof p4 === "function" ? p4(record.state, config) : p4;
   }, [instrument.dragDrop, record.state, config]);
   const layersWithFeedback = useMemo(() => {
     if (!dragDropResult.drag?.feedback) return canvasLayers;
@@ -1626,22 +1680,10 @@ function TrialRuntime({
       }
     ];
   }, [canvasLayers, dragDropResult.drag]);
-  const lens = loupeCap ? /* @__PURE__ */ jsx(
-    TrialLoupe,
-    {
-      capability: loupeCap,
-      enabled: loupeOn,
-      state: record.state,
-      config,
-      view: view2d ?? DEFAULT_VIEW,
-      worldSpec: instrument.canvas?.worldSpec,
-      hostRef: loupeHostRef
-    }
-  ) : null;
   let body;
   if (instrument.canvas) {
     body = /* @__PURE__ */ jsxs("div", { ref: canvasContainerRef, className: "lk-trial__canvas-host", children: [
-      /* @__PURE__ */ jsxs(
+      /* @__PURE__ */ jsx(
         CanvasStack,
         {
           layers: layersWithFeedback,
@@ -1651,10 +1693,7 @@ function TrialRuntime({
           onResize: placeView,
           minZoom: instrument.canvas.minZoom,
           maxZoom: instrument.canvas.maxZoom,
-          children: [
-            instrument.render(renderCtx),
-            lens
-          ]
+          children: instrument.render(renderCtx)
         }
       ),
       /* @__PURE__ */ jsx(DragOverlay, { drag: dragDropResult.drag })
@@ -1669,19 +1708,10 @@ function TrialRuntime({
         onResize: placeView,
         minZoom: stage.minZoom,
         maxZoom: stage.maxZoom,
-        hostRef: loupeHostRef,
-        overlay: /* @__PURE__ */ jsxs(Fragment, { children: [
-          stage.overlay?.(renderCtx),
-          lens
-        ] }),
+        overlay: stage.overlay?.(renderCtx),
         children: instrument.render(renderCtx)
       }
     );
-  } else if (lens) {
-    body = /* @__PURE__ */ jsxs("div", { ref: loupeHostRef, className: "lk-trial__loupe-host", children: [
-      instrument.render(renderCtx),
-      lens
-    ] });
   } else {
     body = instrument.render(renderCtx);
   }
@@ -1692,11 +1722,11 @@ function TrialRuntime({
   );
   const layerListNode = useMemo(
     () => instrument.layers && layerDescriptors.length > 0 ? /* @__PURE__ */ jsx(
-      E3,
+      D2,
       {
         items: layerItems,
         onReorder: (move) => {
-          setLayerOrder(x3(layerItems, move).map((l7) => l7.id));
+          setLayerOrder(S2(layerItems, move).map((l8) => l8.id));
           bus.emit("layers.reorder");
         },
         onVisibilityChange: (lid, visible) => {
@@ -1736,8 +1766,8 @@ 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(
+  const scopedBody = /* @__PURE__ */ jsx(WeaselProvider, { isolate: true, children: /* @__PURE__ */ jsx(PointerContextProvider, { store: pointer, children: /* @__PURE__ */ jsx(CameraPublishContext.Provider, { value: publishCamera, children: /* @__PURE__ */ jsx(LoupeSwitchContext.Provider, { value: loupeSwitch, children: body }) }) }) });
+  return /* @__PURE__ */ jsx(TrialIdProvider, { trialId: record.id, children: /* @__PURE__ */ jsx(AnnotationsContext.Provider, { value: annotationsCap ? provided : null, children: /* @__PURE__ */ jsx(CameraWheelContext.Provider, { value: wheelSlot, children: /* @__PURE__ */ jsxs(
     TrialChrome,
     {
       job: jobCap ? job : void 0,
@@ -1873,11 +1903,11 @@ function reorderTrials(trials, ids) {
 function findOvershoot(bound, items, tolerance = 1) {
   let worst = null;
   for (const { item, edges } of items) {
-    const y3 = edges.bottom - bound.bottom;
-    const x3 = edges.right - bound.right;
-    const by = Math.max(x3, y3);
+    const y2 = edges.bottom - bound.bottom;
+    const x2 = edges.right - bound.right;
+    const by = Math.max(x2, y2);
     if (by <= tolerance) continue;
-    if (!worst || by > worst.by) worst = { item, by, axis: y3 >= x3 ? "y" : "x" };
+    if (!worst || by > worst.by) worst = { item, by, axis: y2 >= x2 ? "y" : "x" };
   }
   return worst;
 }
@@ -1965,7 +1995,7 @@ function LabHeader({ addTrial: addTrial2 = true }) {
       ]
     }
   ) : /* @__PURE__ */ jsx(
-    d3,
+    p4,
     {
       "aria-label": "Add trial",
       label: "Add trial\u2026",
@@ -2000,13 +2030,13 @@ function locate(url) {
 function currentPage(path, pages) {
   const here = locate(path);
   const onDoc = (doc) => here.doc.endsWith(doc);
-  const routed = pages.findIndex((p3) => {
-    if (!p3.href.includes("#")) return false;
-    const page = locate(p3.href);
+  const routed = pages.findIndex((p4) => {
+    if (!p4.href.includes("#")) return false;
+    const page = locate(p4.href);
     return onDoc(page.doc) && (here.route === page.route || here.route.startsWith(`${page.route}/`));
   });
   if (routed >= 0) return routed;
-  return pages.findIndex((p3) => !p3.href.includes("#") && onDoc(locate(p3.href).doc));
+  return pages.findIndex((p4) => !p4.href.includes("#") && onDoc(locate(p4.href).doc));
 }
 function LabSwitcher({ title, pages, path, className }) {
   const [open, setOpen] = useState(false);
@@ -2100,9 +2130,9 @@ 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");
+var KEY_BINDINGS = BASE.defaultBinding.filter((b3) => b3.spec.kind === "key");
 function shortcutFor(kind) {
-  const spec = KEY_BINDINGS.find((b2) => b2.opts?.params?.kind === kind)?.spec;
+  const spec = KEY_BINDINGS.find((b3) => b3.opts?.params?.kind === kind)?.spec;
   return spec?.key ? n2({ key: spec.key, mod: spec.mods?.mod }) : void 0;
 }
 function forZoom(camera) {
@@ -2133,8 +2163,7 @@ function LabZoomControls() {
   });
   const live = zoom !== null && camera !== null;
   const view = useMemo(() => camera ? forZoom(camera) : null, [camera]);
-  const viewRef = useRef(view);
-  viewRef.current = live ? view : null;
+  const viewRef = useLatest(live ? view : null);
   useDepSource("view", () => viewRef.current);
   useEffect(() => {
     const action = {
@@ -2143,7 +2172,7 @@ function LabZoomControls() {
       enabled: () => viewRef.current ? true : ActionDisabledReason.NotApplicable
     };
     return registry.register(action);
-  }, [registry]);
+  }, [registry, viewRef]);
   useGestureDispatcher({
     canvasRef: NO_ELEMENT,
     actions: registry,
@@ -2204,12 +2233,30 @@ var STRATEGIES = { grid: gridStrategy, floating: floatingStrategy };
 var FLOAT_ZONE_ID = asNodeId("lk-workspace-floating");
 var PANEL_KIND = "panel";
 var KIND = "trial";
+function createWorkspaceStore(grid) {
+  const store = new Store();
+  store.registerNode(
+    createNode({
+      kind: "zone",
+      id: ZONE_ID,
+      container: { strategyId: "grid", config: grid }
+    })
+  );
+  store.registerNode(
+    createNode({
+      kind: "zone",
+      id: FLOAT_ZONE_ID,
+      container: { strategyId: "floating", config: {} }
+    })
+  );
+  return store;
+}
 function extentOf(store, id) {
-  const p3 = store.getNode(id)?.membership?.placement;
-  if (!p3) return null;
+  const p4 = store.getNode(id)?.membership?.placement;
+  if (!p4) return null;
   const out = {};
-  if (p3.size) out.size = p3.size;
-  if (p3.span) out.span = p3.span;
+  if (p4.size) out.size = p4.size;
+  if (p4.span) out.span = p4.span;
   return Object.keys(out).length > 0 ? out : null;
 }
 function PanelFrame({ panel, floating = false }) {
@@ -2230,43 +2277,18 @@ function Workspace({
   viewport
 }) {
   const items = Children.toArray(children);
-  const tilePanels = useMemo(() => (panels ?? []).filter((p3) => p3.as === "tile"), [panels]);
-  const floatPanels = useMemo(() => (panels ?? []).filter((p3) => p3.as === "floating"), [panels]);
-  const wantedIds = [
-    ...items.map((_3, i5) => ids?.[i5] ?? `lk-ws-${i5}`),
-    ...tilePanels.map((p3) => `lk-panel-${p3.key}`)
-  ];
-  const idKey = wantedIds.join(",");
-  const idKeyRef = useRef(null);
-  const nodeIdsRef = useRef([]);
-  if (idKeyRef.current !== idKey) {
-    idKeyRef.current = idKey;
-    nodeIdsRef.current = wantedIds.map(asNodeId);
-  }
-  const nodeIds = nodeIdsRef.current;
-  const layoutRef = useRef(layout);
-  layoutRef.current = layout;
-  const onLayoutChangeRef = useRef(onLayoutChange);
-  onLayoutChangeRef.current = onLayoutChange;
+  const tilePanels = useMemo(() => (panels ?? []).filter((p4) => p4.as === "tile"), [panels]);
+  const floatPanels = useMemo(() => (panels ?? []).filter((p4) => p4.as === "floating"), [panels]);
+  const idKey = JSON.stringify([
+    ...items.map((_2, i5) => ids?.[i5] ?? `lk-ws-${i5}`),
+    ...tilePanels.map((p4) => `lk-panel-${p4.key}`)
+  ]);
+  const nodeIds = useMemo(() => JSON.parse(idKey).map(asNodeId), [idKey]);
+  const layoutRef = useLatest(layout);
+  const onLayoutChangeRef = useLatest(onLayoutChange);
   const storeRef = useRef(null);
-  if (storeRef.current === null) {
-    const store2 = new Store();
-    store2.registerNode(
-      createNode({
-        kind: "zone",
-        id: ZONE_ID,
-        container: { strategyId: "grid", config: { resizable, gap, padding } }
-      })
-    );
-    store2.registerNode(
-      createNode({
-        kind: "zone",
-        id: FLOAT_ZONE_ID,
-        container: { strategyId: "floating", config: {} }
-      })
-    );
-    storeRef.current = store2;
-  }
+  if (storeRef.current === null)
+    storeRef.current = createWorkspaceStore({ resizable, gap, padding });
   const store = storeRef.current;
   const surface = useSurfaceOptional();
   useLayoutEffect(() => {
@@ -2287,7 +2309,7 @@ function Workspace({
       if (saved) store.patchPlacement(id, saved);
     }
     store.setChildOrder(ZONE_ID, [...nodeIds]);
-  }, [store, nodeIds]);
+  }, [store, nodeIds, layoutRef]);
   useEffect(() => {
     if (!surface) return;
     surface.invalidateRects();
@@ -2303,7 +2325,7 @@ function Workspace({
       }
       onLayoutChangeRef.current?.(next);
     });
-  }, [store, onLayoutChange]);
+  }, [store, onLayoutChange, onLayoutChangeRef]);
   const commitOrder = useCallback(
     (nextIds) => onReorder?.(nextIds.map(String)),
     [onReorder]
@@ -2311,7 +2333,7 @@ function Workspace({
   const chrome = useMemo(() => {
     const byId = new Map(nodeIds.map((id, i5) => [id, items[i5]]));
     const panelByNode = new Map(
-      tilePanels.map((p3) => [`lk-panel-${p3.key}`, p3])
+      tilePanels.map((p4) => [`lk-panel-${p4.key}`, p4])
     );
     return {
       [PANEL_KIND]: ({ node }) => {
@@ -2329,7 +2351,7 @@ function Workspace({
       }
     };
   }, [nodeIds, items, reorderable, tilePanels]);
-  const floatingLayer = floatPanels.length === 0 ? null : /* @__PURE__ */ jsx("div", { className: "lk-workspace__floating", children: floatPanels.map((p3) => /* @__PURE__ */ jsx(PanelFrame, { panel: p3, floating: true }, p3.key)) });
+  const floatingLayer = floatPanels.length === 0 ? null : /* @__PURE__ */ jsx("div", { className: "lk-workspace__floating", children: floatPanels.map((p4) => /* @__PURE__ */ jsx(PanelFrame, { panel: p4, floating: true }, p4.key)) });
   const grid = /* @__PURE__ */ jsx(
     Container,
     {
@@ -2425,10 +2447,10 @@ var NEBULA_SLOTS = [
 function buildNebula(list, theme, mode, density) {
   const ctx = { theme, resolved: resolveTheme(theme, { mode, density }) };
   const n6 = colorCount(list, ctx) ?? NEBULA_SLOTS.length;
-  const colors = Array.from({ length: n6 }, (_3, i5) => colorAt(list, i5, ctx));
+  const colors = Array.from({ length: n6 }, (_2, 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})`;
+    const p4 = NEBULA_SLOTS[i5 % NEBULA_SLOTS.length];
+    return `radial-gradient(ellipse ${p4.sx} ${p4.sy} at ${p4.cx} ${p4.cy}, color-mix(in srgb, ${c6} 22%, transparent), transparent ${p4.stop})`;
   });
   blobs.push("radial-gradient(ellipse at center, #0a0a18 0%, #02020a 100%)");
   return blobs.join(", ");
@@ -2558,12 +2580,12 @@ function LabRuntime({
     const canvases = [ownUnderRef.current, ownOverRef.current].filter((c6) => c6 !== null);
     if (canvases.length === 0) return;
     const w2 = Math.round(frame.size.width * frame.dpr);
-    const h = Math.round(frame.size.height * frame.dpr);
-    if (bufferRef.current.w !== w2 || bufferRef.current.h !== h) {
-      bufferRef.current = { w: w2, h };
+    const h2 = Math.round(frame.size.height * frame.dpr);
+    if (bufferRef.current.w !== w2 || bufferRef.current.h !== h2) {
+      bufferRef.current = { w: w2, h: h2 };
       for (const c6 of canvases) {
         c6.width = w2;
-        c6.height = h;
+        c6.height = h2;
         c6.style.width = `${frame.size.width}px`;
         c6.style.height = `${frame.size.height}px`;
       }
@@ -2572,7 +2594,9 @@ function LabRuntime({
     }
   }, []);
   const ownSurface = useTiledSurface({ onFrame });
-  surfaceRef.current = ownSurface;
+  useInsertionEffect(() => {
+    surfaceRef.current = ownSurface;
+  }, [ownSurface]);
   const [labBody, setLabBody] = useState(null);
   const attachOwnSurface = ownSurface.containerRef;
   const labBodyRef = useCallback(
@@ -2700,8 +2724,8 @@ function LabRuntime({
         store.getState().deleteSnapshot(snapshotId);
       },
       mode: modeValue,
-      setMode: (m2) => {
-        store.getState().setMode(m2);
+      setMode: (m) => {
+        store.getState().setMode(m);
       },
       configRules,
       controls
@@ -2915,18 +2939,18 @@ function ButtonsAndToggles() {
       /* @__PURE__ */ jsx(Xt, { status: "muted", children: "MUTED" })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "Checkbox, Switch", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
-      /* @__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(c5, { isSelected: snap, onChange: setSnap, children: "Snap to grid" }),
+      /* @__PURE__ */ jsx(c5, { isIndeterminate: true, children: "Mixed" }),
+      /* @__PURE__ */ jsx(a7, { isSelected: wifi, onChange: setWifi, children: "Wifi" })
     ] }) }),
     /* @__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__ */ jsx(u3, { value: "off", children: "Off" }),
+      /* @__PURE__ */ jsx(u3, { value: "grid", children: "Grid" }),
+      /* @__PURE__ */ jsx(u3, { value: "pixel", children: "Pixel" })
     ] }) }),
     /* @__PURE__ */ jsxs(Cell, { label: "ToggleBar", children: [
       /* @__PURE__ */ jsx(
-        a7,
+        a6,
         {
           ariaLabel: "Align",
           value: align,
@@ -2939,7 +2963,7 @@ function ButtonsAndToggles() {
         }
       ),
       /* @__PURE__ */ jsx(
-        a7,
+        a6,
         {
           ariaLabel: "Align, flat",
           variant: "flat",
@@ -2965,7 +2989,7 @@ function ButtonsAndToggles() {
         }
       ),
       /* @__PURE__ */ jsx(
-        a10,
+        a9,
         {
           items: [
             { value: "undo", label: "Undo", onAction: () => {
@@ -2978,7 +3002,7 @@ function ButtonsAndToggles() {
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "MenuButton, Disclosure", children: /* @__PURE__ */ jsxs("div", { className: "lk-specimen__row", children: [
       /* @__PURE__ */ jsx(
-        d3,
+        p4,
         {
           label: "Add trial\u2026",
           onAction: () => {
@@ -2989,17 +3013,17 @@ function ButtonsAndToggles() {
           ]
         }
       ),
-      /* @__PURE__ */ jsx(i2, { open, onToggle: () => setOpen((o5) => !o5), label: "Shapes" })
+      /* @__PURE__ */ jsx(i2, { open, onToggle: () => setOpen((o4) => !o4), label: "Shapes" })
     ] }) }),
-    /* @__PURE__ */ jsx(Cell, { label: "Tabs", children: /* @__PURE__ */ jsxs(o6, { children: [
-      /* @__PURE__ */ jsxs(s4, { "aria-label": "Sections", children: [
+    /* @__PURE__ */ jsx(Cell, { label: "Tabs", children: /* @__PURE__ */ jsxs(o5, { children: [
+      /* @__PURE__ */ jsxs(s3, { "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(l6, { id: "props", children: "Props panel." }),
-      /* @__PURE__ */ jsx(l6, { id: "events", children: "Events panel." }),
-      /* @__PURE__ */ jsx(l6, { id: "snapshot", children: "Snapshot panel." })
+      /* @__PURE__ */ jsx(l8, { id: "props", children: "Props panel." }),
+      /* @__PURE__ */ jsx(l8, { id: "events", children: "Events panel." }),
+      /* @__PURE__ */ jsx(l8, { 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 +3049,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(u3, { label: "Name", placeholder: "e.g. Pico" }),
+      /* @__PURE__ */ jsx(u2, { label: "Name", placeholder: "e.g. Pico" }),
       /* @__PURE__ */ jsx(
-        u3,
+        u2,
         {
           label: "Size",
           leadingAdornment: /* @__PURE__ */ jsx("span", { children: "W" }),
@@ -3035,12 +3059,12 @@ function FieldsAndPickers() {
           defaultValue: "120"
         }
       ),
-      /* @__PURE__ */ jsx(u3, { label: "Required", isInvalid: true, errorMessage: "Name is required." })
+      /* @__PURE__ */ jsx(u2, { label: "Required", isInvalid: true, errorMessage: "Name is required." })
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "NumberField, Select, ComboBox", children: [
       /* @__PURE__ */ jsx(y, { label: "Opacity", minValue: 0, maxValue: 100, step: 5, defaultValue: 80 }),
       /* @__PURE__ */ jsx(
-        E2,
+        O2,
         {
           label: "Color",
           defaultSelectedKey: "g",
@@ -3052,7 +3076,7 @@ function FieldsAndPickers() {
         }
       ),
       /* @__PURE__ */ jsx(
-        y2,
+        b4,
         {
           label: "Filter",
           placeholder: "Type to filter\u2026",
@@ -3064,15 +3088,15 @@ function FieldsAndPickers() {
       )
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "RangeSlider, Slider", children: [
-      /* @__PURE__ */ jsx(l7, { label: "Range", defaultValue: [20, 80], minValue: 0, maxValue: 100 }),
+      /* @__PURE__ */ jsx(l9, { label: "Range", defaultValue: [20, 80], minValue: 0, maxValue: 100 }),
       /* @__PURE__ */ jsx(
-        l7,
+        l9,
         {
           label: "Opacity",
           defaultValue: 75,
           minValue: 0,
           maxValue: 100,
-          formatOutput: (v) => `${v}%`
+          formatOutput: (v2) => `${v2}%`
         }
       ),
       /* @__PURE__ */ jsx(
@@ -3113,11 +3137,11 @@ function FieldsAndPickers() {
       )
     ] }),
     /* @__PURE__ */ jsxs(Cell, { label: "ColorField, GradientEditor", children: [
-      /* @__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(h2, { value: color, alpha: true, onInput: setColor, onChange: setColor, "aria-label": "Color" }),
+      /* @__PURE__ */ jsx(j, { value: gradient, onInput: setGradient, onChange: setGradient, kindSwitch: true })
     ] }),
     /* @__PURE__ */ jsx(Cell, { label: "PaintInput", children: /* @__PURE__ */ jsx(
-      T,
+      k2,
       {
         value: paint,
         onInput: setPaint,
@@ -3146,7 +3170,7 @@ function PanelsAndRows() {
   ]);
   const [panelCollapsed, setPanelCollapsed] = useState(false);
   return /* @__PURE__ */ jsxs(Section, { title: "Panels & property rows", children: [
-    /* @__PURE__ */ jsx(Cell, { label: "PropertyPanel", children: /* @__PURE__ */ jsx(re2, { title: "Shape", children: /* @__PURE__ */ jsxs(ie2, { children: [
+    /* @__PURE__ */ jsx(Cell, { label: "PropertyPanel", children: /* @__PURE__ */ jsx(oe, { title: "Shape", children: /* @__PURE__ */ jsxs(se, { children: [
       /* @__PURE__ */ jsx(
         R,
         {
@@ -3227,7 +3251,7 @@ function PanelsAndRows() {
       ),
       /* @__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(
+      /* @__PURE__ */ jsx(b3, { title: "Bevel", defaultCollapsed: true, children: /* @__PURE__ */ jsx(
         R,
         {
           kind: "number",
@@ -3243,7 +3267,7 @@ function PanelsAndRows() {
       ) })
     ] }) }) }),
     /* @__PURE__ */ jsx(Cell, { label: "PrefsForm", children: /* @__PURE__ */ jsx(
-      j,
+      j2,
       {
         schema: PREFS,
         values: prefs,
@@ -3251,10 +3275,10 @@ function PanelsAndRows() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "LayerList", children: /* @__PURE__ */ jsx(
-      E3,
+      D2,
       {
         items: layers,
-        onReorder: (move) => setLayers(x3(layers, move)),
+        onReorder: (move) => setLayers(S2(layers, move)),
         renderBody: (item) => /* @__PURE__ */ jsxs("div", { children: [
           "settings for ",
           item.label
@@ -3262,11 +3286,11 @@ 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(
-      a11,
+      a10,
       {
         title: "Selection",
         collapsed: panelCollapsed,
-        onToggleCollapse: () => setPanelCollapsed((v) => !v),
+        onToggleCollapse: () => setPanelCollapsed((v2) => !v2),
         onHide: () => {
         },
         children: /* @__PURE__ */ jsx("div", { className: "lk-specimen__pad", children: "2 items selected" })
@@ -3278,7 +3302,7 @@ function OverlaysAndFeedback() {
   const calloutAnchor = useRef(null);
   const [calloutOpen, setCalloutOpen] = useState(false);
   const [dialogOpen, setDialogOpen] = useState(false);
-  const toasts = useMemo(() => m3(), []);
+  const toasts = useMemo(() => C3(), []);
   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: [
@@ -3287,7 +3311,7 @@ function OverlaysAndFeedback() {
       ] }),
       /* @__PURE__ */ jsx("button", { type: "button", ref: calloutAnchor, onClick: () => setCalloutOpen(true), children: "Callout" }),
       /* @__PURE__ */ jsx(
-        _2,
+        v2,
         {
           triggerRef: calloutAnchor,
           isOpen: calloutOpen,
@@ -3299,7 +3323,7 @@ function OverlaysAndFeedback() {
       ),
       /* @__PURE__ */ jsx(c, { onClick: () => setDialogOpen(true), children: "Dialog" }),
       /* @__PURE__ */ jsx(
-        d2,
+        d3,
         {
           isOpen: dialogOpen,
           onOpenChange: setDialogOpen,
@@ -3315,7 +3339,7 @@ function OverlaysAndFeedback() {
           children: "Toast"
         }
       ),
-      /* @__PURE__ */ jsx(S3, { queue: toasts, placement: "bottom-right" })
+      /* @__PURE__ */ jsx(j3, { queue: toasts, placement: "bottom-right" })
     ] }) }),
     /* @__PURE__ */ jsx(Cell, { label: "Powerline", children: /* @__PURE__ */ jsx(
       r4,
@@ -3378,7 +3402,6 @@ function ToolChrome() {
         label: id,
         shortcut: id.slice(0, 1).toUpperCase(),
         active: tool === id,
-        tabbable: tool === id,
         onClick: () => setTool(id)
       },
       id
@@ -3390,7 +3413,7 @@ function ToolChrome() {
     /* @__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(
-        c5,
+        l7,
         {
           value: paneWidth,
           min: 100,
@@ -3499,7 +3522,7 @@ function EditorsAndPlots() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "BandEditor", wide: true, children: /* @__PURE__ */ jsx(
-      j2,
+      j4,
       {
         min: 1 / 64,
         max: 1 / 2,
@@ -3509,12 +3532,12 @@ function EditorsAndPlots() {
         onChange: setBands,
         selectedIndex: band,
         onSelect: setBand,
-        renderBand: (b2) => b2.data.name,
+        renderBand: (b3) => b3.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(
-      ye,
+      be,
       {
         tracks,
         duration: 2e3,
@@ -3577,6 +3600,6 @@ function Specimen({ className }) {
   ] });
 }
 
-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 };
+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, fromWeaselView, interstellarTheme, isStale, reorderTrials, resetTrial, resolveMarkStyle, seenFrom, toWeaselView, validateConfigSchema };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map