@weasel-js/labkit 1.8.0 → 1.8.1

package/dist/index.js

@@ -1,46 +1,46 @@
 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-2N7UBSS2.js';
-import { useTiledSurface } from './chunk-EESJUSYR.js';
-export { composeRects, toDeviceRect, useTiledSurface } from './chunk-EESJUSYR.js';
+import { createEventBus } from './chunk-UX66USTN.js';
+export { clearUndo, createEventBus, emptyStack, pushSnapshot, redo, undo } from './chunk-UX66USTN.js';
+import { useDragDrop, DragOverlay, Palette } from './chunk-J5MDJEOZ.js';
+import { useTiledSurface } from './chunk-QMAY74TP.js';
+export { composeRects, toDeviceRect, useTiledSurface } from './chunk-QMAY74TP.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-YDE6XATS.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-YDE6XATS.js';
+import { markCommands, boundsOf, roundFrac, worldToFrac, fracToWorld, fracEncloses, fracContains, POINT_MARK_SHAPE, roundPoints, fromShape, markSvgNodes, toShape } from './chunk-6Q6ACJ3H.js';
+export { fracContains, fracEncloses, fracToWorld, markCommands, markSvgNodes, roundFrac, worldToFrac } from './chunk-6Q6ACJ3H.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-RN7T7OBO.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-RN7T7OBO.js';
 import { AnnotationsContext } from './chunk-3RY6WL5T.js';
 export { AnnotationsContext, useAnnotations, useAnnotationsOptional } from './chunk-3RY6WL5T.js';
-import { Split, JobProgress, Legend } from './chunk-NVKBL7ZE.js';
-export { JobProgress, Legend, Readout, Split } from './chunk-NVKBL7ZE.js';
-import { FloatingPanel } from './chunk-XE5HJOPL.js';
-export { FloatingPanel } from './chunk-XE5HJOPL.js';
-import { Toolbar, StatusBar, ScaleIndicator, ZoomControl } from './chunk-3L4MLLQB.js';
-export { FpsMeter, ScaleIndicator, StatusBar, Toolbar, ZoomControl } from './chunk-3L4MLLQB.js';
+import { Split, JobProgress, Legend } from './chunk-KHB3KRRQ.js';
+export { JobProgress, Legend, Readout, Split } from './chunk-KHB3KRRQ.js';
+import { FloatingPanel } from './chunk-7FMZT2WL.js';
+export { FloatingPanel } from './chunk-7FMZT2WL.js';
+import { Toolbar, ScaleIndicator, ZoomControl } from './chunk-RXO5UEGT.js';
+export { FpsMeter, ScaleIndicator, Toolbar, ZoomControl } from './chunk-RXO5UEGT.js';
 import './chunk-CZZPXUOU.js';
-import { unruledConfigSchema, createLabStore, openLabStore, panelKey } from './chunk-XXACAPVU.js';
-export { CURRENT_DOCUMENT_VERSION, dockPanel, labDocumentKey, openLabStore, panelKey, quarantineKey, undockPanel, useTrialState } from './chunk-XXACAPVU.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 { ControlMatrix } from './chunk-YX75W6EK.js';
-export { ControlPanel, inDialog, summarizeValue } from './chunk-7KAETQSS.js';
-import { useConfigSchema } from './chunk-MOTDMMMN.js';
-export { sectionTree, useConfigSchema } from './chunk-MOTDMMMN.js';
-import { useLabContext, LabContext } from './chunk-Z76KEZAX.js';
+import { unruledConfigSchema, createLabStore, openLabStore, panelKey } from './chunk-NHIO2O3O.js';
+export { CURRENT_DOCUMENT_VERSION, dockPanel, labDocumentKey, openLabStore, panelKey, quarantineKey, undockPanel, useTrialState } from './chunk-NHIO2O3O.js';
+import { valueRecord, newId, useWarnIgnoredChange, useOpenOnce, PersistenceContext, createRecordCache, noneAdapter, defaultStorage, usePersistedState } from './chunk-7ALJOVGP.js';
+export { Persistence, createIndexedDbAdapter, createMemoryAdapter, indexedDbAdapter, localStorageAdapter, noneAdapter, sessionStorageAdapter, urlHashAdapter, usePersistedState } from './chunk-7ALJOVGP.js';
+export { ControlMatrix } from './chunk-4RCVWX4M.js';
+export { ControlPanel, inDialog, summarizeValue } from './chunk-YZA73U4A.js';
+import { useConfigSchema } from './chunk-SQX35X5V.js';
+export { sectionTree, useConfigSchema } from './chunk-SQX35X5V.js';
+import { LabContext, useLabContext } from './chunk-Z76KEZAX.js';
 export { LabContext, useLabContext } from './chunk-Z76KEZAX.js';
-import { useResolvedConfig } from './chunk-J5HJJDLF.js';
-export { BaseNode, BooleanNode, ColorNode, CustomNode, EnumNode, GroupNode, ListNode, NumberNode, StringNode, ValueNode, applyRules, builtinRules, f, isConfigBranch, resolveConfigSchema, titleCase, useResolvedConfig } from './chunk-J5HJJDLF.js';
+import { useResolvedConfig } from './chunk-T5OEUNCB.js';
+export { BaseNode, BooleanNode, ColorNode, CustomNode, EnumNode, GroupNode, ListNode, NumberNode, StringNode, ValueNode, applyRules, builtinRules, f, isConfigBranch, resolveConfigSchema, titleCase, useResolvedConfig } from './chunk-T5OEUNCB.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';
+import { CanvasStack, Stage, fitStage } from './chunk-XWR2P6MR.js';
+export { CanvasStack, Stage, fitStage } from './chunk-XWR2P6MR.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 { useSurfaceOptional, useSurfaceCanvas, useTileId, useTileInScope, SurfaceContext, SurfaceCanvasContext } from './chunk-6IIKLXBZ.js';
+export { SurfaceCanvasContext, SurfaceContext, useSurface, useSurfaceCanvas, useSurfaceOptional, useSurfaceTile, useTileId, useTileInScope } from './chunk-6IIKLXBZ.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';
@@ -50,12 +50,12 @@ 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 { D2, S, X, U, G, p6, o3, c, Xt, c4, a5, l5, u3, s3, r3, a7, i3, o5, s5, c5, l8, p, f2, u2, y, O2, b4, l9, w2, c6, i4, h2, j, k2, ce, le, ye, b3, j2, n6, a8, C3, l3, u, v3, d3, j3, r4, n7, r5, i5, p2, f, n8, o4, p4, l7, w, L, n9, j4, xe2, n2 } from './chunk-WURZTJGQ.js';
-export { c as Button, V as CloseIcon, xe as CollapseIcon, _ as CurveField, s as DetailList, c2 as DetailRow, Se as ExpandIcon, l as Icon, u2 as Input, l10 as Jog, D2 as LayerList, re as PauseIcon, ne as PlayIcon, be as PropertyControl, ye as PropertyField, b3 as PropertyGroup, le as PropertyList, ce as PropertyPanel, L2 as PropertyRow, ue as PropertySpan, B as ResetIcon, O2 as Select, ae as StepBackIcon, $ as StepForwardIcon, ie as StopIcon, x2 as Subpanel, s3 as ToggleBar, oe as TokenPanel, H2 as inferTokenType, S as moveLayers, O3 as refitScale } from './chunk-WURZTJGQ.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 { A2, T, Z, U, V, de, G, p6, o3, c, Xt, c4, a5, l5, u3, s3, r3, a7, i3, o5, s5, c5, l8, p, f3, u2, y, O2, b4, l9, w2, c6, i4, h2, j, k2, ce2, le, ye, b3, j2, n6, a8, C3, l3, u, v3, d2, j3, r4, n7, r5, i5, p2, f2, n8, o4, p4, l7, w, L, n9, j4, xe, n2 } from './chunk-V4SMGEYY.js';
+export { c as Button, V as CloseIcon, we as CollapseIcon, _ as CurveField, s as DetailList, c2 as DetailRow, Te as ExpandIcon, l as Icon, u2 as Input, l10 as Jog, A2 as LayerList, oe as PauseIcon, ae as PlayIcon, be as PropertyControl, ye as PropertyField, b3 as PropertyGroup, le as PropertyList, ce2 as PropertyPanel, L2 as PropertyRow, ue as PropertySpan, B as ResetIcon, O2 as Select, n7 as StatusBar, r5 as StatusBarItem, i5 as StatusBarSpacer, ce as StepBackIcon, $ as StepForwardIcon, se as StopIcon, x2 as Subpanel, s3 as ToggleBar, oe2 as TokenPanel, H2 as inferTokenType, T as moveLayers, O3 as refitScale } from './chunk-V4SMGEYY.js';
+import { serializeSvg } from './chunk-VCK5T6EP.js';
+import './chunk-AVOILDN2.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, createHistory, useVisibleRaf, stableStringify } from '@weasel-js/core';
+import { createContext, useState, useRef, useEffect, useInsertionEffect, useCallback, useContext, useSyncExternalStore, useReducer, useLayoutEffect, useMemo, 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';
@@ -668,6 +668,7 @@ function AnnotationOverlay({
   const configRef = useLatest(config);
   const id = target.id;
   const tileId = useTileId(id);
+  const inScope = useTileInScope(tileId);
   const lastTile = useRef(null);
   useEffect(() => {
     const el = target.ref.current ?? null;
@@ -758,6 +759,7 @@ function AnnotationOverlay({
           className: "lk-annotate__input",
           "data-annotation-target": id,
           "data-idle": annotationToolInfo(activeToolId) ? void 0 : "",
+          hidden: !inScope,
           role: "application",
           "aria-label": `Annotations on ${id}`,
           tabIndex: 0,
@@ -811,6 +813,62 @@ function AnnotationTargets({
     t.id
   )) });
 }
+function createClockRegistry() {
+  const handles = /* @__PURE__ */ new Map();
+  const listeners = /* @__PURE__ */ new Set();
+  const notify = () => {
+    for (const l8 of [...listeners]) l8();
+  };
+  return {
+    register(trialId, handle) {
+      handles.set(trialId, handle);
+      notify();
+      return () => {
+        if (handles.get(trialId) !== handle) return;
+        handles.delete(trialId);
+        notify();
+      };
+    },
+    get: (trialId) => handles.get(trialId) ?? null,
+    all: () => handles.values(),
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    }
+  };
+}
+var ClockRegistryContext = createContext(null);
+var TrialClockContext = createContext(null);
+
+// src/clock/hooks.ts
+var NO_SUBSCRIBE = () => () => {
+};
+function useTrialClock(trialId) {
+  const registry = useContext(ClockRegistryContext);
+  const own = useContext(TrialClockContext);
+  const lab = useContext(LabContext);
+  useSyncExternalStore(registry?.subscribe ?? NO_SUBSCRIBE, () => registry ? resolve() : own);
+  function resolve() {
+    if (trialId !== void 0) return registry?.get(trialId) ?? null;
+    if (own) return own;
+    const focused = lab?.focusedTrialId;
+    return focused ? registry?.get(focused) ?? null : null;
+  }
+  const clock = resolve()?.clock ?? null;
+  const [, bump] = useReducer((n6) => n6 + 1, 0);
+  useEffect(() => clock?.subscribe(bump), [clock]);
+  return clock;
+}
+function useClockFrame(fn) {
+  const handle = useContext(TrialClockContext);
+  const latest = useLatest(fn);
+  useEffect(
+    () => handle?.onFrame((elapsed, pass) => latest.current(elapsed, pass)),
+    [handle, latest]
+  );
+}
 
 // src/instrument/defineInstrument.ts
 function defineInstrument(spec) {
@@ -870,6 +928,41 @@ function validateConfigSchema(fields) {
   return { valid: errors.length === 0, errors };
 }
 var AnnotationPreloadContext = createContext(null);
+function useClockLoop(registry) {
+  const loop = useVisibleRaf(
+    (timestamp) => {
+      let live = false;
+      for (const { clock } of registry.all()) {
+        if (clock.inert) continue;
+        clock.sync(timestamp);
+        if (!clock.inert) live = true;
+      }
+      if (live) loop.request();
+    },
+    {
+      onResume: () => {
+        for (const { clock } of registry.all()) clock.rebase();
+      }
+    }
+  );
+  useEffect(() => {
+    let unwakes = [];
+    const attach = () => {
+      for (const off2 of unwakes) off2();
+      unwakes = [];
+      for (const { clock } of registry.all()) {
+        unwakes.push(clock.onWake(() => loop.request()));
+        if (!clock.inert) loop.request();
+      }
+    };
+    attach();
+    const off = registry.subscribe(attach);
+    return () => {
+      off();
+      for (const unwake of unwakes) unwake();
+    };
+  }, [registry, loop]);
+}
 
 // src/theme/interstellar.theme.json
 var interstellar_theme_default = {
@@ -996,6 +1089,180 @@ var interstellarTheme = defineTheme({
   extends: weaselTheme
 });
 
+// src/clock/trialClock.ts
+var passesOf = (loop) => loop === true ? Number.POSITIVE_INFINITY : loop === false ? 1 : Math.max(1, loop);
+var checkRate = (rate, seekable) => {
+  if (!Number.isFinite(rate)) throw new RangeError(`labkit: a clock's rate is finite, not ${rate}`);
+  if (rate < 0 && !seekable)
+    throw new RangeError("labkit: a clock that is not seekable cannot run backward");
+};
+function createTrialClock(spec, start) {
+  const duration = spec.duration ?? Number.POSITIVE_INFINITY;
+  const seekable = spec.seekable ?? true;
+  const openRate = spec.rate ?? 0;
+  checkRate(openRate, seekable);
+  let loop = spec.loop ?? false;
+  let span = duration * passesOf(loop);
+  let rate = start ? start.rate : openRate;
+  let elapsed = start ? Math.min(Math.max(0, start.elapsed), span) : 0;
+  let ramp = null;
+  let last = Number.NaN;
+  let changed = false;
+  let slept = false;
+  let wakeFired = false;
+  const wakes = /* @__PURE__ */ new Set();
+  const subs = /* @__PURE__ */ new Set();
+  const frames = /* @__PURE__ */ new Set();
+  const isInert = () => rate === 0 && ramp === null && !changed;
+  const notify = () => {
+    for (const fn of [...subs]) fn();
+  };
+  const change = () => {
+    changed = true;
+    if (wakeFired) return;
+    wakeFired = true;
+    for (const fn of [...wakes]) fn();
+  };
+  const passAt = () => duration > 0 && Number.isFinite(duration) ? elapsed >= span ? passesOf(loop) - 1 : Math.floor(elapsed / duration) : 0;
+  const phaseAt = () => duration > 0 && Number.isFinite(duration) ? elapsed >= span ? 1 : elapsed % duration / duration : 0;
+  const advance = (dt) => {
+    if (!ramp) return rate * dt;
+    if (dt >= ramp.left) {
+      const area2 = (rate + ramp.to) / 2 * ramp.left + ramp.to * (dt - ramp.left);
+      rate = ramp.to;
+      ramp = null;
+      notify();
+      return area2;
+    }
+    const next = rate + (ramp.to - rate) * dt / ramp.left;
+    const area = (rate + next) / 2 * dt;
+    rate = next;
+    ramp.left -= dt;
+    return area;
+  };
+  const clock = {
+    get elapsed() {
+      return elapsed;
+    },
+    get pass() {
+      return passAt();
+    },
+    get phase() {
+      return phaseAt();
+    },
+    get rate() {
+      return rate;
+    },
+    set rate(next) {
+      checkRate(next, seekable);
+      rate = next;
+      ramp = null;
+      change();
+      notify();
+    },
+    get loop() {
+      return loop;
+    },
+    set loop(next) {
+      loop = next;
+      span = duration * passesOf(loop);
+      elapsed = Math.min(elapsed, span);
+      change();
+      notify();
+    },
+    ramp(to, over) {
+      checkRate(to, seekable);
+      if (!(over > 0)) {
+        clock.rate = to;
+        return;
+      }
+      ramp = { to, left: over };
+      change();
+      notify();
+    },
+    seek(target) {
+      if (!seekable) throw new Error("labkit: this clock is not seekable");
+      elapsed = Math.min(Math.max(0, target), span);
+      change();
+      notify();
+    },
+    sync(timestamp) {
+      const wasChanged = changed;
+      const before = elapsed;
+      if (!Number.isNaN(last) && !slept) {
+        elapsed += advance(Math.max(0, timestamp - last));
+        if (elapsed >= span && rate > 0) {
+          elapsed = span;
+          rate = 0;
+          ramp = null;
+          notify();
+        } else if (elapsed <= 0 && rate < 0) {
+          elapsed = 0;
+          rate = 0;
+          ramp = null;
+          notify();
+        }
+      }
+      last = timestamp;
+      changed = false;
+      wakeFired = false;
+      slept = isInert();
+      if (elapsed !== before || wasChanged) {
+        const pass = passAt();
+        for (const fn of [...frames]) fn(elapsed, pass);
+      }
+    },
+    rebase() {
+      last = Number.NaN;
+    },
+    get inert() {
+      return isInert();
+    },
+    onWake(fn) {
+      wakes.add(fn);
+      return () => {
+        wakes.delete(fn);
+      };
+    },
+    subscribe(fn) {
+      subs.add(fn);
+      return () => {
+        subs.delete(fn);
+      };
+    }
+  };
+  return {
+    clock,
+    reset() {
+      elapsed = 0;
+      rate = openRate;
+      ramp = null;
+      change();
+      notify();
+    },
+    onFrame(fn) {
+      frames.add(fn);
+      return () => {
+        frames.delete(fn);
+      };
+    }
+  };
+}
+
+// src/undo/stateOp.ts
+function stateOp(before, read, write) {
+  let after;
+  const forward = {
+    label: "state",
+    apply: () => write(structuredClone(after)),
+    invert: () => {
+      after = structuredClone(read());
+      return { label: "state", apply: () => write(structuredClone(before)), invert: () => forward };
+    }
+  };
+  return forward;
+}
+
 // src/canvas/cameraZoom.ts
 function atScale(view, scale, at) {
   return {
@@ -1013,6 +1280,36 @@ function zoomCameraTo(camera, zoom) {
   const scale = Math.min(max, Math.max(min, zoom));
   camera.set(atScale(camera.get(), scale, viewMiddle(camera)));
 }
+var PresentationContext = createContext(null);
+function usePresentation() {
+  const value = useContext(PresentationContext);
+  if (!value) throw new Error("[labkit] usePresentation() must be called inside <Lab>");
+  return value;
+}
+function usePresentedTrial(trialId) {
+  const presented = useContext(PresentationContext)?.trialId === trialId;
+  const surface = useSurfaceOptional();
+  const [el, ref] = useState(null);
+  useLayoutEffect(() => {
+    if (!presented || !el || !surface) return;
+    surface.scope(el);
+    return () => surface.scope(null);
+  }, [presented, el, surface]);
+  return { presented, ref };
+}
+function hasPresentParam() {
+  return typeof location !== "undefined" && new URLSearchParams(location.search).has("present");
+}
+var LightboxContext = createContext(null);
+function useLightbox() {
+  return useContext(LightboxContext);
+}
+function useLightboxControl() {
+  const ctx = useContext(LightboxContext);
+  const claim = ctx?.claimControl;
+  useLayoutEffect(() => claim?.(), [claim]);
+  return ctx;
+}
 function TrialBody({ sidebar, children, contentClassName, ...rest }) {
   return /* @__PURE__ */ jsx(
     Split,
@@ -1131,6 +1428,7 @@ function TrialChrome({
   children
 }) {
   const lab = useLabContext();
+  const { presented, ref: presentedRef } = usePresentedTrial(trialId);
   const storeCtx = useContext(LabStoreContext);
   if (!storeCtx) throw new Error("[labkit] TrialChrome requires <LabStoreProvider>");
   const updateTrialView = useStore(storeCtx.store, (s4) => s4.updateTrialView);
@@ -1160,6 +1458,7 @@ function TrialChrome({
     cameras?.subscribe ?? noSubscribe,
     () => cameras?.get(trialId) ?? null
   );
+  const lightbox = useLightboxControl();
   const ctx = useMemo(() => {
     const setZoom = (z) => {
       if (camera) zoomCameraTo(camera, z);
@@ -1180,6 +1479,9 @@ function TrialChrome({
       hasLoupe: loupe != null,
       loupeOn: loupe?.on ?? false,
       toggleLoupe: loupe?.toggle ?? NO_OP,
+      canExpand: lightbox != null,
+      expanded: lightbox?.expanded ?? false,
+      toggleExpanded: lightbox?.toggle ?? NO_OP,
       configSchema,
       configFields: instrument.config ? [] : instrument.configSchema?.() ?? [],
       config: record.config,
@@ -1225,6 +1527,7 @@ function TrialChrome({
     updateTrialState,
     undoBindings,
     loupe,
+    lightbox,
     view2d,
     activeToolId,
     setActiveTool,
@@ -1255,7 +1558,7 @@ function TrialChrome({
   const inRegion = (region) => contributions.filter((c6) => c6.region === region);
   const handleKeyDown = (e) => {
     const mod = e.metaKey || e.ctrlKey;
-    if (!mod) return;
+    if (!mod || presented) return;
     if (e.key === "z" || e.key === "Z") {
       e.preventDefault();
       if (e.shiftKey) ctx.redo();
@@ -1268,9 +1571,11 @@ function TrialChrome({
   return /* @__PURE__ */ jsxs(
     "section",
     {
+      ref: presentedRef,
       className: "lk-trial",
       "data-trial-id": trialId,
       "data-focused": lab.trials.length > 1 && lab.focusedTrialId === trialId ? "true" : void 0,
+      "data-lk-presented": presented ? "" : void 0,
       "aria-label": `Trial ${title}`,
       tabIndex: -1,
       onKeyDown: handleKeyDown,
@@ -1291,7 +1596,10 @@ function TrialChrome({
             {
               width: record.sidebarWidth,
               onWidthChange: (w3) => updateTrialSidebarWidth(trialId, w3),
-              contentClassName: instrument.canvas || instrument.stage ? "lk-trial__content--flush" : void 0,
+              contentClassName: [
+                instrument.canvas || instrument.stage ? "lk-trial__content--flush" : "",
+                presented ? "lk-trial__stage" : ""
+              ].filter(Boolean).join(" ") || void 0,
               sidebar: /* @__PURE__ */ jsxs(Fragment, { children: [
                 /* @__PURE__ */ jsx(SidebarRegion, { contributions: inRegion("sidebar"), ctx }),
                 /* @__PURE__ */ jsx(
@@ -1399,7 +1707,8 @@ function TrialRuntime({
   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 setTrialHistory = useStore(store, (s4) => s4.setTrialHistory);
+  const updateTrialClock = useStore(store, (s4) => s4.updateTrialClock);
   const updateTrialAnnotations = useStore(store, (s4) => s4.updateTrialAnnotations);
   const labToolId = useStore(store, (s4) => s4.activeToolId);
   const setLabTool = useStore(store, (s4) => s4.setLabTool);
@@ -1422,6 +1731,25 @@ function TrialRuntime({
     () => (instrument.canvas?.layers ?? []).filter((l8) => layerVisibility[l8.id] !== false).map((l8) => l8.id),
     [instrument.canvas, layerVisibility]
   );
+  const [clockHandle] = useState(
+    () => instrument.clock ? createTrialClock(instrument.clock, record.clock) : null
+  );
+  const clocks = useContext(ClockRegistryContext);
+  useEffect(() => {
+    if (!clockHandle || !clocks) return;
+    return clocks.register(record.id, clockHandle);
+  }, [clocks, clockHandle, record.id]);
+  useEffect(() => {
+    if (!clockHandle) return;
+    const { clock } = clockHandle;
+    return clock.subscribe(
+      () => updateTrialClock(record.id, { elapsed: clock.elapsed, rate: clock.rate })
+    );
+  }, [clockHandle, record.id, updateTrialClock]);
+  const ticks = useMemo(
+    () => clockHandle ? (fn) => clockHandle.onFrame(() => fn()) : void 0,
+    [clockHandle]
+  );
   const undoCap = instrument.undo;
   const undoEvents = useMemo(() => new Set(undoCap?.snapshotOn ?? ["state.change"]), [undoCap]);
   const maxDepth = undoCap?.maxDepth ?? 50;
@@ -1429,8 +1757,14 @@ function TrialRuntime({
     if (!undoCap || !undoEvents.has(event)) return;
     const current = store.getState().trials.find((w3) => w3.id === record.id);
     if (!current) return;
-    const snap = structuredClone(current.state);
-    updateTrialUndoStack(record.id, (prev) => pushSnapshot(prev, snap, maxDepth));
+    let history = current.history;
+    if (!history) {
+      history = createHistory(null, { historyLimit: maxDepth });
+      setTrialHistory(record.id, history);
+    }
+    const read = () => store.getState().trials.find((w3) => w3.id === record.id)?.state;
+    const write = (state) => updateTrialState(record.id, state);
+    history.recordEntry([stateOp(structuredClone(current.state), read, write)], event);
   };
   const setView = (v2) => updateTrialView(record.id, v2);
   const stage = instrument.canvas ? void 0 : instrument.stage;
@@ -1559,7 +1893,8 @@ function TrialRuntime({
       },
       activeToolId: resolvedToolId,
       visibleLayers,
-      pointer
+      pointer,
+      ...clockHandle ? { clock: clockHandle.clock } : {}
     },
     emit: (event) => {
       snapshotIfNeeded(event);
@@ -1567,28 +1902,17 @@ function TrialRuntime({
     },
     job: jobCap ? job : void 0
   };
-  const undoState = () => {
-    const result = undo(record.undoStack, structuredClone(record.state));
-    if (!result) return;
-    updateTrialState(record.id, result.snapshot);
-    updateTrialUndoStack(record.id, result.stack);
-  };
-  const redoState = () => {
-    const result = redo(record.undoStack, structuredClone(record.state));
-    if (!result) return;
-    updateTrialState(record.id, result.snapshot);
-    updateTrialUndoStack(record.id, result.stack);
-  };
+  const stateHistory = useHistoryVersion(record.history);
   const undoBindings = undoCap || annotationsCap ? {
-    canUndo: markMoves.undo || (undoCap ? record.undoStack.past.length > 0 : false),
-    canRedo: markMoves.redo || (undoCap ? record.undoStack.future.length > 0 : false),
+    canUndo: markMoves.undo || (undoCap ? stateHistory?.canUndo() ?? false : false),
+    canRedo: markMoves.redo || (undoCap ? stateHistory?.canRedo() ?? false : false),
     undo: () => {
       if (annotationsCap && annotations.undo()) return;
-      if (undoCap) undoState();
+      if (undoCap) stateHistory?.undo();
     },
     redo: () => {
       if (annotationsCap && annotations.redo()) return;
-      if (undoCap) redoState();
+      if (undoCap) stateHistory?.redo();
     }
   } : void 0;
   const loupeBindings = lenses > 0 ? { on: loupeOn, toggle: () => setLoupeOn((v2) => !v2) } : void 0;
@@ -1596,15 +1920,24 @@ function TrialRuntime({
     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 clock = clockHandle?.clock;
     return ordered.map((layer) => ({
       id: layer.id,
       visible: layerVisibility[layer.id] !== false,
+      timed: layer.timed === true,
       render: (ctx, view, frame) => {
         applyCamera(ctx, view, frame);
-        layer.draw(ctx, { state: record.state, config, zoom: view.zoom });
+        layer.draw(ctx, {
+          state: record.state,
+          config,
+          zoom: view.zoom,
+          elapsed: clock?.elapsed ?? 0,
+          pass: clock?.pass ?? 0,
+          phase: clock?.phase ?? 0
+        });
       }
     }));
-  }, [instrument.canvas, record.state, config, layerVisibility, layerOrder]);
+  }, [instrument.canvas, record.state, config, layerVisibility, layerOrder, clockHandle]);
   const layerDescriptors = useMemo(() => {
     if (!instrument.layers) return [];
     return instrument.layers.ids.map((l8) => typeof l8 === "string" ? { id: l8, label: l8 } : l8);
@@ -1680,6 +2013,7 @@ function TrialRuntime({
           onResize: placeView,
           minZoom: instrument.canvas.minZoom,
           maxZoom: instrument.canvas.maxZoom,
+          ticks,
           children: instrument.render(renderCtx)
         }
       ),
@@ -1709,11 +2043,11 @@ function TrialRuntime({
   );
   const layerListNode = useMemo(
     () => instrument.layers && layerDescriptors.length > 0 ? /* @__PURE__ */ jsx(
-      D2,
+      A2,
       {
         items: layerItems,
         onReorder: (move) => {
-          setLayerOrder(S(layerItems, move).map((l8) => l8.id));
+          setLayerOrder(T(layerItems, move).map((l8) => l8.id));
           bus.emit("layers.reorder");
         },
         onVisibilityChange: (lid, visible) => {
@@ -1754,7 +2088,7 @@ function TrialRuntime({
     }
   ) : null;
   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(
+  return /* @__PURE__ */ jsx(TrialIdProvider, { trialId: record.id, children: /* @__PURE__ */ jsx(TrialClockContext.Provider, { value: clockHandle, 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,
@@ -1774,7 +2108,13 @@ function TrialRuntime({
         annotationOverlays
       ]
     }
-  ) }) }) });
+  ) }) }) }) });
+}
+var NO_SUBSCRIBE2 = () => () => {
+};
+function useHistoryVersion(history) {
+  useSyncExternalStore(history?.subscribe ?? NO_SUBSCRIBE2, () => history?.getVersion() ?? 0);
+  return history;
 }
 
 // src/trial/trialOps.ts
@@ -1827,8 +2167,7 @@ function addTrial(trials, instruments, instrumentName, options = {}) {
     instrumentName,
     config,
     state,
-    view: initialView(instrument),
-    undoStack: { past: [], future: [] }
+    view: initialView(instrument)
   };
   if (options.config) record.configSeed = seeded.config;
   if (seeded.autoPaths.length > 0) record.autoSeed = seeded.autoPaths;
@@ -1839,13 +2178,13 @@ function cloneTrial(trials, id) {
   const sourceIdx = trials.findIndex((w3) => w3.id === id);
   const source = trials[sourceIdx];
   if (!source) return trials;
+  const { history: _history, ...rest } = source;
   const clone = {
-    ...source,
+    ...rest,
     id: newId(),
     config: structuredClone(source.config),
     state: structuredClone(source.state),
-    view: structuredClone(source.view),
-    undoStack: { past: [], future: [] }
+    view: structuredClone(source.view)
   };
   return [...trials.slice(0, sourceIdx + 1), clone, ...trials.slice(sourceIdx + 1)];
 }
@@ -2112,6 +2451,91 @@ function LabShell({
     footer && /* @__PURE__ */ jsx("footer", { className: "lk-shell-footer", children: footer })
   ] });
 }
+var NONE = { below: [], above: [] };
+var LightboxLayersContext = createContext(NONE);
+function LightboxLayers({ below, above, children }) {
+  const value = useMemo(
+    () => ({ below: below ?? NONE.below, above: above ?? NONE.above }),
+    [below, above]
+  );
+  return /* @__PURE__ */ jsx(LightboxLayersContext.Provider, { value, children });
+}
+function useLightboxLayers() {
+  return useContext(LightboxLayersContext);
+}
+function LabSurface({ bodyRef, children }) {
+  const outerSurface = useSurfaceOptional();
+  const outerOver = useSurfaceCanvas("over");
+  const outerUnder = useSurfaceCanvas("under");
+  const [ownOver, setOwnOver] = useState(null);
+  const [ownUnder, setOwnUnder] = useState(null);
+  const [underLayer, setUnderLayer] = useState(null);
+  const [overLayer, setOverLayer] = useState(null);
+  const ownOverRef = useRef(null);
+  const ownUnderRef = useRef(null);
+  const bufferRef = useRef({ w: 0, h: 0 });
+  const surfaceRef = useRef(null);
+  const onFrame = useCallback((frame) => {
+    const canvases2 = [ownUnderRef.current, ownOverRef.current].filter((c6) => c6 !== null);
+    if (canvases2.length === 0) return;
+    const w3 = Math.round(frame.size.width * frame.dpr);
+    const h2 = Math.round(frame.size.height * frame.dpr);
+    if (bufferRef.current.w !== w3 || bufferRef.current.h !== h2) {
+      bufferRef.current = { w: w3, h: h2 };
+      for (const c6 of canvases2) {
+        c6.width = w3;
+        c6.height = h2;
+        c6.style.width = `${frame.size.width}px`;
+        c6.style.height = `${frame.size.height}px`;
+      }
+      surfaceRef.current?.invalidateAll();
+      return;
+    }
+  }, []);
+  const ownSurface = useTiledSurface({ onFrame });
+  useInsertionEffect(() => {
+    surfaceRef.current = ownSurface;
+  }, [ownSurface]);
+  const attachOwnSurface = ownSurface.containerRef;
+  const overLayerRef = useCallback(
+    (el) => {
+      setOverLayer(el);
+      attachOwnSurface(el);
+    },
+    [attachOwnSurface]
+  );
+  const surface = outerSurface ?? ownSurface;
+  const canvases = useMemo(
+    () => outerSurface ? { over: outerOver, under: outerUnder } : { over: ownOver, under: ownUnder },
+    [outerSurface, outerOver, outerUnder, ownOver, ownUnder]
+  );
+  const below = useMemo(() => [underLayer], [underLayer]);
+  const above = useMemo(() => [overLayer], [overLayer]);
+  const body = /* @__PURE__ */ jsxs("div", { className: "lk-lab__body", ref: bodyRef, children: [
+    outerSurface ? null : /* @__PURE__ */ jsx("div", { className: "lk-lab__layer lk-lab__layer--under", ref: setUnderLayer, children: /* @__PURE__ */ jsx(
+      "canvas",
+      {
+        className: "lk-lab__surface",
+        ref: (el) => {
+          ownUnderRef.current = el;
+          setOwnUnder(el);
+        }
+      }
+    ) }),
+    children,
+    outerSurface ? null : /* @__PURE__ */ jsx("div", { className: "lk-lab__layer lk-lab__layer--over", ref: overLayerRef, children: /* @__PURE__ */ jsx(
+      "canvas",
+      {
+        className: "lk-lab__surface",
+        ref: (el) => {
+          ownOverRef.current = el;
+          setOwnOver(el);
+        }
+      }
+    ) })
+  ] });
+  return /* @__PURE__ */ jsx(SurfaceContext.Provider, { value: surface, children: /* @__PURE__ */ jsx(SurfaceCanvasContext.Provider, { value: canvases, children: /* @__PURE__ */ jsx(LightboxLayers, { below, above, children: body }) }) });
+}
 var ZOOM_ID = "viewport.zoom";
 var NO_TOOLS = /* @__PURE__ */ new Map();
 var CHANNELS = { contextMenu: false, ingest: false };
@@ -2187,7 +2611,7 @@ function LabZoomControls() {
         title: hint("Zoom out", "out"),
         disabled: !canOut,
         onClick: run("out"),
-        children: /* @__PURE__ */ jsx(X, { size: 16 })
+        children: /* @__PURE__ */ jsx(Z, { size: 16 })
       }
     ),
     /* @__PURE__ */ jsx(
@@ -2215,6 +2639,311 @@ function LabZoomControls() {
 }
 var noSubscribe2 = () => () => {
 };
+var NEBULA_SLOTS = [
+  { cx: "18%", cy: "30%", sx: "60%", sy: "80%", stop: "70%" },
+  { cx: "78%", cy: "70%", sx: "55%", sy: "90%", stop: "65%" },
+  { cx: "50%", cy: "50%", sx: "50%", sy: "70%", stop: "75%" },
+  { cx: "12%", cy: "82%", sx: "50%", sy: "70%", stop: "70%" },
+  { cx: "85%", cy: "18%", sx: "55%", sy: "80%", stop: "70%" }
+];
+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 }, (_2, i4) => colorAt(list, i4, ctx));
+  const blobs = colors.map((c6, i4) => {
+    const p5 = NEBULA_SLOTS[i4 % NEBULA_SLOTS.length];
+    return `radial-gradient(ellipse ${p5.sx} ${p5.sy} at ${p5.cx} ${p5.cy}, color-mix(in srgb, ${c6} 22%, transparent), transparent ${p5.stop})`;
+  });
+  blobs.push("radial-gradient(ellipse at center, #0a0a18 0%, #02020a 100%)");
+  return blobs.join(", ");
+}
+function presentStorageKey(storageKey) {
+  return `${storageKey}:present`;
+}
+var SEED_RECORD = valueRecord(null, "lk-present-seed");
+function seedPresentedTrial(store, records, { instruments, defaultInstrument }, seed) {
+  const instrument = seed.instrument ?? defaultInstrument;
+  const fingerprint = stableStringify({ ...seed, instrument });
+  const trials = store.getState().trials;
+  if (trials.length > 0 && records.get(SEED_RECORD) === fingerprint) return;
+  const record = addTrial([], instruments, instrument, { config: seed.config })[0];
+  if (!record) return;
+  store.setState({ trials: [] });
+  store.getState().addTrial({
+    ...record,
+    ..."state" in seed ? { state: seed.state } : {},
+    ..."view" in seed ? { view: seed.view } : {}
+  });
+  records.set(SEED_RECORD, fingerprint);
+}
+function seedDefaultTrial(store, instruments, defaultInstrument) {
+  if (store.getState().trials.length > 0) return;
+  const record = addTrial([], instruments, defaultInstrument)[0];
+  if (!record) return;
+  store.getState().addTrial(record);
+}
+function openUnstoredLab(options, seed) {
+  const { instruments, defaultInstrument, mode } = options;
+  const store = createLabStore({ initialMode: mode ?? "auto", instruments });
+  const records = createRecordCache({ storage: noneAdapter, prefix: "", writable: false });
+  if (seed) seedPresentedTrial(store, records, options, seed);
+  else seedDefaultTrial(store, instruments, defaultInstrument);
+  return { store, records, close: () => records.close(), marks: /* @__PURE__ */ new Map() };
+}
+async function openStoredLab(options, storageKey, storage, seed) {
+  const { instruments, defaultInstrument, mode } = options;
+  const opened = await openLabStore({
+    storageKey,
+    storage: storage ?? await defaultStorage(),
+    initialMode: mode ?? "auto",
+    instruments
+  });
+  if (seed) seedPresentedTrial(opened.store, opened.records, options, seed);
+  else seedDefaultTrial(opened.store, instruments, defaultInstrument);
+  const marks = /* @__PURE__ */ new Map();
+  await Promise.all(
+    opened.store.getState().trials.map(async (trial) => {
+      const kept = instruments.find((i4) => i4.name === trial.instrumentName)?.annotations?.storage;
+      if (!kept) return;
+      try {
+        marks.set(trial.id, await kept.load());
+      } catch (error) {
+        console.warn(`[labkit] could not load the marks of trial "${trial.id}"`, error);
+        marks.set(trial.id, null);
+      }
+    })
+  );
+  return { ...opened, marks };
+}
+function useFocusPick(labBody, store, pick) {
+  useEffect(() => {
+    if (!labBody) return;
+    const pickFrom = (node) => {
+      const owned = new Set(store.getState().trials.map((t) => t.id));
+      const nearest = (from) => from?.closest(".lk-trial[data-trial-id]") ?? null;
+      let trial = typeof node?.closest === "function" ? nearest(node) : null;
+      while (trial && !owned.has(trial.dataset.trialId ?? "")) trial = nearest(trial.parentElement);
+      if (trial?.dataset.trialId) pick(trial.dataset.trialId);
+    };
+    const onInput = (event) => pickFrom(event.target);
+    let pending;
+    const doc = labBody.ownerDocument;
+    const win = doc.defaultView;
+    const onBlur = () => {
+      clearTimeout(pending);
+      pending = setTimeout(() => pickFrom(doc.activeElement), 0);
+    };
+    labBody.addEventListener("pointerdown", onInput, true);
+    labBody.addEventListener("focusin", onInput, true);
+    win?.addEventListener("blur", onBlur);
+    return () => {
+      clearTimeout(pending);
+      labBody.removeEventListener("pointerdown", onInput, true);
+      labBody.removeEventListener("focusin", onInput, true);
+      win?.removeEventListener("blur", onBlur);
+    };
+  }, [labBody, store, pick]);
+}
+
+// src/lightbox/modal.ts
+var OWN_DOUBLE_CLICK = [
+  "button",
+  "a[href]",
+  "input",
+  "select",
+  "textarea",
+  "label",
+  "summary",
+  '[contenteditable]:not([contenteditable="false"])',
+  '[role="button"]',
+  '[role="checkbox"]',
+  '[role="combobox"]',
+  '[role="link"]',
+  '[role="menuitem"]',
+  '[role="option"]',
+  '[role="radio"]',
+  '[role="separator"]',
+  '[role="slider"]',
+  '[role="spinbutton"]',
+  '[role="switch"]',
+  '[role="tab"]',
+  '[role="textbox"]',
+  "[data-lk-lightbox-ignore]"
+].join(",");
+function opensLightbox(event, root) {
+  if (event.defaultPrevented) return false;
+  const target = event.target;
+  if (!(target instanceof Element)) return true;
+  const owner = target.closest(OWN_DOUBLE_CLICK);
+  return owner === null || !root.contains(owner);
+}
+function inertOutside(keep) {
+  const path = /* @__PURE__ */ new Set();
+  for (const el of keep) {
+    for (let node = el; node && node !== document.body; node = node.parentElement) {
+      path.add(node);
+    }
+  }
+  const marked = [];
+  for (const node of path) {
+    const parent = node.parentElement;
+    if (!parent) continue;
+    for (const sibling of Array.from(parent.children)) {
+      if (path.has(sibling) || sibling.hasAttribute("inert")) continue;
+      sibling.setAttribute("inert", "");
+      marked.push(sibling);
+    }
+  }
+  return () => {
+    for (const sibling of marked) sibling.removeAttribute("inert");
+  };
+}
+function liftStack(stack, self) {
+  if (typeof self.showPopover !== "function") return () => {
+  };
+  stack.forEach((el, i4) => {
+    el.setAttribute("popover", "manual");
+    if (el !== self) el.setAttribute("data-lk-lightbox-layer", "");
+    if (i4 === 0) el.setAttribute("data-lk-lightbox-scrim", "");
+    el.showPopover();
+  });
+  return () => {
+    for (const el of [...stack].reverse()) {
+      if (el.matches(":popover-open")) el.hidePopover();
+      el.removeAttribute("popover");
+      el.removeAttribute("data-lk-lightbox-layer");
+      el.removeAttribute("data-lk-lightbox-scrim");
+    }
+  };
+}
+function dialogProps(label) {
+  return {
+    role: "dialog",
+    "aria-modal": true,
+    "aria-label": label,
+    "data-wzl-portal-host": ""
+  };
+}
+function Lightbox({
+  children,
+  label = "Expanded view",
+  disabled = false,
+  expandOnDoubleClick = false,
+  expanded: expandedProp,
+  onExpandedChange,
+  className
+}) {
+  const [own, setOwn] = useState(false);
+  const expanded = !disabled && (expandedProp ?? own);
+  const onChangeRef = useLatest(onExpandedChange);
+  const expandedRef = useLatest(expanded);
+  const rootRef = useRef(null);
+  const closeRef = useRef(null);
+  const [claims, setClaims] = useState(0);
+  const layers = useLightboxLayers();
+  const surface = useSurfaceOptional();
+  const set = useCallback(
+    (next) => {
+      if (next === expandedRef.current) return;
+      setOwn(next);
+      onChangeRef.current?.(next);
+    },
+    [expandedRef, onChangeRef]
+  );
+  const ctx = useMemo(
+    () => disabled ? null : {
+      expanded,
+      open: () => set(true),
+      close: () => set(false),
+      toggle: () => set(!expandedRef.current),
+      claimControl: () => {
+        setClaims((n6) => n6 + 1);
+        return () => setClaims((n6) => n6 - 1);
+      }
+    },
+    [disabled, expanded, set, expandedRef]
+  );
+  useLayoutEffect(() => {
+    const el = rootRef.current;
+    if (!expanded || !el) return;
+    const returnTo = document.activeElement;
+    const stack = [...layers.below, el, ...layers.above].filter(
+      (layer) => layer !== null
+    );
+    const unlift = liftStack(stack, el);
+    const release = inertOutside(stack);
+    surface?.scope(el);
+    closeRef.current?.focus({ preventScroll: true });
+    return () => {
+      surface?.scope(null);
+      release();
+      unlift();
+      if (returnTo?.isConnected) returnTo.focus({ preventScroll: true });
+    };
+  }, [expanded, layers, surface]);
+  useEffect(() => {
+    if (!expanded) return;
+    const onKey = (e) => {
+      if (e.key !== "Escape" || e.defaultPrevented) return;
+      e.preventDefault();
+      set(false);
+    };
+    document.addEventListener("keydown", onKey);
+    return () => document.removeEventListener("keydown", onKey);
+  }, [expanded, set]);
+  const onDoubleClick = (e) => {
+    if (disabled || !expandOnDoubleClick || !opensLightbox(e, e.currentTarget)) return;
+    e.preventDefault();
+    set(!expanded);
+  };
+  const onClick = (e) => {
+    if (expanded && e.target === e.currentTarget) set(false);
+  };
+  const classes = ["lk-lightbox"];
+  if (expanded) classes.push("lk-lightbox--expanded");
+  if (className) classes.push(className);
+  let control = null;
+  if (expanded) {
+    control = /* @__PURE__ */ jsx(
+      "button",
+      {
+        ref: closeRef,
+        type: "button",
+        className: "lk-lightbox__button lk-lightbox__close",
+        "aria-label": "Close expanded view",
+        title: "Close (Esc)",
+        onClick: () => set(false),
+        children: /* @__PURE__ */ jsx(V, { size: 16 })
+      }
+    );
+  } else if (!disabled && claims === 0) {
+    control = /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "lk-lightbox__button lk-lightbox__open",
+        "aria-label": "Expand",
+        title: "Expand",
+        onClick: () => set(true),
+        children: /* @__PURE__ */ jsx(de, { size: 16 })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(LightboxContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: rootRef,
+      className: classes.join(" "),
+      ...expanded ? dialogProps(label) : null,
+      onDoubleClick,
+      onClick,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "lk-lightbox__frame", children }),
+        control
+      ]
+    }
+  ) });
+}
 var ZONE_ID = asNodeId("lk-workspace");
 var STRATEGIES = { grid: gridStrategy, floating: floatingStrategy };
 var FLOAT_ZONE_ID = asNodeId("lk-workspace-floating");
@@ -2261,7 +2990,9 @@ function Workspace({
   onLayoutChange,
   gap = 12,
   padding = 0,
-  viewport
+  viewport,
+  lightbox = true,
+  expandOnDoubleClick = false
 }) {
   const items = Children.toArray(children);
   const tilePanels = useMemo(() => (panels ?? []).filter((p5) => p5.as === "tile"), [panels]);
@@ -2318,6 +3049,8 @@ function Workspace({
     [onReorder]
   );
   const chrome = useMemo(() => {
+    const lightboxFor = typeof lightbox === "function" ? lightbox : () => lightbox;
+    const doubleClickFor = typeof expandOnDoubleClick === "function" ? expandOnDoubleClick : () => expandOnDoubleClick;
     const byId = new Map(nodeIds.map((id, i4) => [id, items[i4]]));
     const panelByNode = new Map(
       tilePanels.map((p5) => [`lk-panel-${p5.key}`, p5])
@@ -2329,15 +3062,28 @@ function Workspace({
         return /* @__PURE__ */ jsx(PanelFrame, { panel });
       },
       [KIND]: ({ node }) => {
-        const content = byId.get(node.id) ?? null;
-        if (!reorderable) return content;
+        const id = String(node.id);
+        const tile = (
+          // `disabled` rather than leaving the wrapper out, so turning the
+          // lightbox off cannot remount the tile.
+          /* @__PURE__ */ jsx(
+            Lightbox,
+            {
+              className: "lk-trial-tile",
+              disabled: !lightboxFor(id),
+              expandOnDoubleClick: doubleClickFor(id),
+              children: byId.get(node.id) ?? null
+            }
+          )
+        );
+        if (!reorderable) return tile;
         return (
           // No grip strip: the trial's own title bar is the drag surface.
-          /* @__PURE__ */ jsx(TrialDragContext.Provider, { value: { nodeId: node.id }, children: /* @__PURE__ */ jsx("div", { className: "lk-trial-tile", children: content }) })
+          /* @__PURE__ */ jsx(TrialDragContext.Provider, { value: { nodeId: node.id }, children: tile })
         );
       }
     };
-  }, [nodeIds, items, reorderable, tilePanels]);
+  }, [nodeIds, items, reorderable, tilePanels, lightbox, expandOnDoubleClick]);
   const floatingLayer = floatPanels.length === 0 ? null : /* @__PURE__ */ jsx("div", { className: "lk-workspace__floating", children: floatPanels.map((p5) => /* @__PURE__ */ jsx(PanelFrame, { panel: p5, floating: true }, p5.key)) });
   const grid = /* @__PURE__ */ jsx(
     Container,
@@ -2360,42 +3106,6 @@ function Workspace({
     ] })
   ) : reorderable ? /* @__PURE__ */ jsx(DragProvider, { children: grid }) : grid }) });
 }
-function seedDefaultTrial(store, instruments, defaultInstrument) {
-  if (store.getState().trials.length > 0) return;
-  const record = addTrial([], instruments, defaultInstrument)[0];
-  if (!record) return;
-  const { undoStack: _undoStack, ...rest } = record;
-  store.getState().addTrial(rest);
-}
-function openUnstoredLab({ instruments, defaultInstrument, mode }) {
-  const store = createLabStore({ initialMode: mode ?? "auto", instruments });
-  seedDefaultTrial(store, instruments, defaultInstrument);
-  const records = createRecordCache({ storage: noneAdapter, prefix: "", writable: false });
-  return { store, records, close: () => records.close(), marks: /* @__PURE__ */ new Map() };
-}
-async function openStoredLab({ instruments, defaultInstrument, mode }, storageKey, storage) {
-  const opened = await openLabStore({
-    storageKey,
-    storage: storage ?? await defaultStorage(),
-    initialMode: mode ?? "auto",
-    instruments
-  });
-  seedDefaultTrial(opened.store, instruments, defaultInstrument);
-  const marks = /* @__PURE__ */ new Map();
-  await Promise.all(
-    opened.store.getState().trials.map(async (trial) => {
-      const kept = instruments.find((i4) => i4.name === trial.instrumentName)?.annotations?.storage;
-      if (!kept) return;
-      try {
-        marks.set(trial.id, await kept.load());
-      } catch (error) {
-        console.warn(`[labkit] could not load the marks of trial "${trial.id}"`, error);
-        marks.set(trial.id, null);
-      }
-    })
-  );
-  return { ...opened, marks };
-}
 function LabFallback({
   title,
   mode,
@@ -2424,24 +3134,6 @@ function LabFallback({
     }
   );
 }
-var NEBULA_SLOTS = [
-  { cx: "18%", cy: "30%", sx: "60%", sy: "80%", stop: "70%" },
-  { cx: "78%", cy: "70%", sx: "55%", sy: "90%", stop: "65%" },
-  { cx: "50%", cy: "50%", sx: "50%", sy: "70%", stop: "75%" },
-  { cx: "12%", cy: "82%", sx: "50%", sy: "70%", stop: "70%" },
-  { cx: "85%", cy: "18%", sx: "55%", sy: "80%", stop: "70%" }
-];
-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 }, (_2, i4) => colorAt(list, i4, ctx));
-  const blobs = colors.map((c6, i4) => {
-    const p5 = NEBULA_SLOTS[i4 % NEBULA_SLOTS.length];
-    return `radial-gradient(ellipse ${p5.sx} ${p5.sy} at ${p5.cx} ${p5.cy}, color-mix(in srgb, ${c6} 22%, transparent), transparent ${p5.stop})`;
-  });
-  blobs.push("radial-gradient(ellipse at center, #0a0a18 0%, #02020a 100%)");
-  return blobs.join(", ");
-}
 function LabPanes({
   contributions,
   children
@@ -2498,13 +3190,21 @@ function Lab(props) {
   if (process.env.NODE_ENV !== "production" && props.instruments.length === 0) {
     throw new Error("[labkit] <Lab> requires a non-empty `instruments` array");
   }
-  const { storageKey, storage } = props;
-  useWarnIgnoredChange("<Lab>", { storageKey, storage });
-  const opened = useOpenOnce(
-    () => storageKey === void 0 ? openUnstoredLab(props) : openStoredLab(props, storageKey, storage)
-  );
+  const { storageKey, storage, present } = props;
+  useWarnIgnoredChange("<Lab>", { storageKey, storage, present });
+  const [startsPresenting] = useState(() => present === true || hasPresentParam());
+  if (process.env.NODE_ENV !== "production" && props.seed && !startsPresenting) {
+    warnSeedIgnored();
+  }
+  const opened = useOpenOnce(() => {
+    const seed = startsPresenting ? props.seed ?? {} : void 0;
+    if (storageKey === void 0) return openUnstoredLab(props, seed);
+    const key = startsPresenting ? presentStorageKey(storageKey) : storageKey;
+    return openStoredLab(props, key, storage, seed);
+  });
   if (!opened) {
     if (props.fallback !== void 0) return props.fallback;
+    if (startsPresenting) return null;
     return /* @__PURE__ */ jsx(
       LabFallback,
       {
@@ -2517,7 +3217,13 @@ function Lab(props) {
       }
     );
   }
-  return /* @__PURE__ */ jsx(LabRuntime, { ...props, opened });
+  return /* @__PURE__ */ jsx(LabRuntime, { ...props, opened, startsPresenting });
+}
+var seedWarned = false;
+function warnSeedIgnored() {
+  if (seedWarned) return;
+  seedWarned = true;
+  console.warn("[labkit] <Lab> reads `seed` only when it starts presenting; it is ignored here");
 }
 function LabRuntime({
   instruments,
@@ -2532,13 +3238,15 @@ function LabRuntime({
   chrome,
   labChrome,
   suppress,
+  expandOnDoubleClick = false,
   addTrial: addTrial2,
   zoom = true,
   tools,
   configRules,
   controls,
   children,
-  opened
+  opened,
+  startsPresenting
 }) {
   const { store } = opened;
   useLayoutEffect(() => {
@@ -2546,86 +3254,42 @@ function LabRuntime({
   }, [instruments, store]);
   const trials = useStore(store, (s4) => s4.trials);
   const [cameras] = useState(createCameraRegistry);
+  const [clocks] = useState(createClockRegistry);
+  useClockLoop(clocks);
   const [focusPick, setFocusPick] = useState(null);
   const focusedTrialId = trials.some((t) => t.id === focusPick) ? focusPick : trials[0]?.id ?? null;
+  const [presentedBy, setPresentedBy] = useState(
+    startsPresenting ? "mount" : null
+  );
+  const presenting = presentedBy !== null;
+  const presentation = useMemo(
+    () => ({
+      active: presenting,
+      enter: () => setPresentedBy((by) => by ?? "enter"),
+      exit: () => setPresentedBy(null),
+      trialId: presenting ? focusedTrialId : null
+    }),
+    [presenting, focusedTrialId]
+  );
   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 panelHostsRef = useRef(null);
   if (panelHostsRef.current === null) panelHostsRef.current = createPanelHostRegistry();
-  const outerSurface = useSurfaceOptional();
-  const outerOver = useSurfaceCanvas("over");
-  const outerUnder = useSurfaceCanvas("under");
-  const [ownOver, setOwnOver] = useState(null);
-  const [ownUnder, setOwnUnder] = useState(null);
-  const ownOverRef = useRef(null);
-  const ownUnderRef = useRef(null);
-  const bufferRef = useRef({ w: 0, h: 0 });
-  const surfaceRef = useRef(null);
-  const onFrame = useCallback((frame) => {
-    const canvases = [ownUnderRef.current, ownOverRef.current].filter((c6) => c6 !== null);
-    if (canvases.length === 0) return;
-    const w3 = Math.round(frame.size.width * frame.dpr);
-    const h2 = Math.round(frame.size.height * frame.dpr);
-    if (bufferRef.current.w !== w3 || bufferRef.current.h !== h2) {
-      bufferRef.current = { w: w3, h: h2 };
-      for (const c6 of canvases) {
-        c6.width = w3;
-        c6.height = h2;
-        c6.style.width = `${frame.size.width}px`;
-        c6.style.height = `${frame.size.height}px`;
-      }
-      surfaceRef.current?.invalidateAll();
-      return;
-    }
-  }, []);
-  const ownSurface = useTiledSurface({ onFrame });
-  useInsertionEffect(() => {
-    surfaceRef.current = ownSurface;
-  }, [ownSurface]);
   const [labBody, setLabBody] = useState(null);
-  const attachOwnSurface = ownSurface.containerRef;
-  const labBodyRef = useCallback(
-    (el) => {
-      setLabBody(el);
-      if (!outerSurface) attachOwnSurface(el);
-    },
-    [outerSurface, attachOwnSurface]
-  );
   useLabFitWarning(labBody);
+  useFocusPick(labBody, store, setFocusPick);
   useEffect(() => {
-    if (!labBody) return;
-    const pick = (node) => {
-      const owned = new Set(store.getState().trials.map((t) => t.id));
-      const nearest = (from) => from?.closest(".lk-trial[data-trial-id]") ?? null;
-      let trial = typeof node?.closest === "function" ? nearest(node) : null;
-      while (trial && !owned.has(trial.dataset.trialId ?? "")) trial = nearest(trial.parentElement);
-      if (trial?.dataset.trialId) setFocusPick(trial.dataset.trialId);
-    };
-    const onInput = (event) => pick(event.target);
-    let pending;
+    if (presentedBy !== "enter" || !labBody) return;
     const doc = labBody.ownerDocument;
-    const win = doc.defaultView;
-    const onBlur = () => {
-      clearTimeout(pending);
-      pending = setTimeout(() => pick(doc.activeElement), 0);
+    const onKeyDown = (event) => {
+      if (event.key !== "Escape" || event.defaultPrevented) return;
+      setPresentedBy(null);
     };
-    labBody.addEventListener("pointerdown", onInput, true);
-    labBody.addEventListener("focusin", onInput, true);
-    win?.addEventListener("blur", onBlur);
-    return () => {
-      clearTimeout(pending);
-      labBody.removeEventListener("pointerdown", onInput, true);
-      labBody.removeEventListener("focusin", onInput, true);
-      win?.removeEventListener("blur", onBlur);
-    };
-  }, [labBody, store]);
-  const surface = outerSurface ?? ownSurface;
-  const surfaceCanvases = useMemo(
-    () => outerSurface ? { over: outerOver, under: outerUnder } : { over: ownOver, under: ownUnder },
-    [outerSurface, outerOver, outerUnder, ownOver, ownUnder]
-  );
+    doc.addEventListener("keydown", onKeyDown);
+    return () => doc.removeEventListener("keydown", onKeyDown);
+  }, [presentedBy, labBody]);
   const workspacePanels = useMemo(
     () => Object.entries(undockedPanels).map(([key, panel]) => ({
       key,
@@ -2698,6 +3362,7 @@ function LabRuntime({
             (w3) => w3.id === id ? { ...w3, config: record.config, state: record.state, view: record.view } : w3
           )
         }));
+        clocks.get(id)?.reset();
       },
       savedSnapshots,
       saveSnapshot: (trialId, name) => {
@@ -2718,6 +3383,7 @@ function LabRuntime({
       controls
     };
   }, [
+    clocks,
     instruments,
     trials,
     focusedTrialId,
@@ -2745,15 +3411,19 @@ function LabRuntime({
       onReorder: (ids) => contextValue.reorderTrials(ids),
       layout,
       onLayoutChange: (next) => store.getState().setLayout(next),
+      expandOnDoubleClick: typeof expandOnDoubleClick === "function" ? (id) => {
+        const trial = trials.find((t) => t.id === id);
+        return trial ? expandOnDoubleClick(trial) : false;
+      } : expandOnDoubleClick,
       children: trials.map((w3) => /* @__PURE__ */ jsx(Trial, { id: w3.id, chrome, suppress }, w3.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(CameraRegistryContext.Provider, { value: cameras, 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(PresentationContext.Provider, { value: presentation, children: /* @__PURE__ */ jsx(CameraRegistryContext.Provider, { value: cameras, children: /* @__PURE__ */ jsx(ClockRegistryContext.Provider, { value: clocks, children: /* @__PURE__ */ jsx(
     ThemeProvider,
     {
       theme,
       selection: { mode: resolvedMode, density: density ?? "comfortable" },
-      className: "lk-lab",
+      className: presenting ? "lk-lab lk-lab--present" : "lk-lab",
       style: backdropStyle,
       children: /* @__PURE__ */ jsx(
         LabShell,
@@ -2768,53 +3438,22 @@ function LabRuntime({
           ] }) : footer,
           header: /* @__PURE__ */ jsxs(Fragment, { children: [
             /* @__PURE__ */ jsx(LabHeader, { ...addTrial2 !== void 0 ? { addTrial: addTrial2 } : {} }),
-            zoom ? /* @__PURE__ */ jsx(LabZoom, {}) : null,
+            zoom && !presenting ? /* @__PURE__ */ jsx(LabZoom, {}) : null,
             children,
             /* @__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 : (
-              // Two buffers stacked around the trials, both inert —
-              // each tile takes input from its own box. A tile's marks
-              // annotate the instrument's DOM from over it; an opaque
-              // renderer sits under it, so the pane can still hold a
-              // label. The under one is first so it paints first.
-              /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(
-                  "canvas",
-                  {
-                    className: "lk-lab__surface lk-lab__surface--under",
-                    ref: (el) => {
-                      ownUnderRef.current = el;
-                      setOwnUnder(el);
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "canvas",
-                  {
-                    className: "lk-lab__surface lk-lab__surface--over",
-                    ref: (el) => {
-                      ownOverRef.current = el;
-                      setOwnOver(el);
-                    }
-                  }
-                )
-              ] })
-            ),
-            hasPaneChrome ? /* @__PURE__ */ jsxs(LabPanes, { contributions: labChromeAll, children: [
-              /* @__PURE__ */ jsx(LabPalette, { contributions: labChromeAll }),
-              workspace
-            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-              /* @__PURE__ */ jsx(LabPalette, { contributions: labChromeAll }),
-              workspace
-            ] })
-          ] }) }) }) })
+          children: /* @__PURE__ */ jsx(PanelHostContext.Provider, { value: panelHostsRef.current, children: /* @__PURE__ */ jsx(LabSurface, { bodyRef: setLabBody, children: hasPaneChrome ? /* @__PURE__ */ jsxs(LabPanes, { contributions: labChromeAll, children: [
+            /* @__PURE__ */ jsx(LabPalette, { contributions: labChromeAll }),
+            workspace
+          ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(LabPalette, { contributions: labChromeAll }),
+            workspace
+          ] }) }) })
         }
       )
     }
-  ) }) }) }) }) });
+  ) }) }) }) }) }) }) });
 }
 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 }) }) }) }) }) }) }) }) }) }) }) }) });
@@ -3014,8 +3653,8 @@ function ButtonsAndToggles() {
     ] }) }),
     /* @__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: "+" }),
-      /* @__PURE__ */ jsx(f2, { label: "K" }),
-      /* @__PURE__ */ jsx(f2, { label: "\u2325", variant: "minimal" })
+      /* @__PURE__ */ jsx(f3, { label: "K" }),
+      /* @__PURE__ */ jsx(f3, { label: "\u2325", variant: "minimal" })
     ] }) })
   ] });
 }
@@ -3157,7 +3796,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(ce, { title: "Shape", children: /* @__PURE__ */ jsxs(le, { children: [
+    /* @__PURE__ */ jsx(Cell, { label: "PropertyPanel", children: /* @__PURE__ */ jsx(ce2, { title: "Shape", children: /* @__PURE__ */ jsxs(le, { children: [
       /* @__PURE__ */ jsx(
         ye,
         {
@@ -3262,10 +3901,10 @@ function PanelsAndRows() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "LayerList", children: /* @__PURE__ */ jsx(
-      D2,
+      A2,
       {
         items: layers,
-        onReorder: (move) => setLayers(S(layers, move)),
+        onReorder: (move) => setLayers(T(layers, move)),
         renderBody: (item) => /* @__PURE__ */ jsxs("div", { children: [
           "settings for ",
           item.label
@@ -3310,7 +3949,7 @@ function OverlaysAndFeedback() {
       ),
       /* @__PURE__ */ jsx(c, { onClick: () => setDialogOpen(true), children: "Dialog" }),
       /* @__PURE__ */ jsx(
-        d3,
+        d2,
         {
           isOpen: dialogOpen,
           onOpenChange: setDialogOpen,
@@ -3362,7 +4001,7 @@ function ListsAndData() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "DataGrid", children: /* @__PURE__ */ jsx(
-      f,
+      f2,
       {
         rows: [
           { id: "1", name: "accent", count: 3 },
@@ -3524,7 +4163,7 @@ function EditorsAndPlots() {
       }
     ) }),
     /* @__PURE__ */ jsx(Cell, { label: "Timeline", wide: true, children: /* @__PURE__ */ jsx("div", { className: "lk-specimen__timeline", children: /* @__PURE__ */ jsx(
-      xe2,
+      xe,
       {
         tracks,
         duration: 2e3,
@@ -3549,10 +4188,6 @@ function LabChrome() {
       /* @__PURE__ */ jsx(Toolbar.Group, { end: true, children: /* @__PURE__ */ jsx(Toolbar.Button, { onClick: () => {
       }, children: "Save" }) })
     ] }) }),
-    /* @__PURE__ */ jsx(Cell, { label: "StatusBar", children: /* @__PURE__ */ jsxs(StatusBar, { children: [
-      /* @__PURE__ */ jsx(StatusBar.Section, { children: "Items: 12" }),
-      /* @__PURE__ */ jsx(StatusBar.Section, { children: "Zoom: 100%" })
-    ] }) }),
     /* @__PURE__ */ jsxs(Cell, { label: "Legend, JobProgress", children: [
       /* @__PURE__ */ jsx(Legend, { entries: LEGEND }),
       /* @__PURE__ */ jsx(JobProgress, { job: JOB })
@@ -3587,6 +4222,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, fromWeaselView, interstellarTheme, isStale, reorderTrials, resetTrial, resolveMarkStyle, seenFrom, toWeaselView, validateConfigSchema };
+export { AnnotationOverlay, AnnotationTargets, Lab, LabBoundary, LabPalette, LabRoot, LabShell, LabSwitcher, LabZoom, Lightbox, LightboxLayers, 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, useClockFrame, useLightbox, useLightboxControl, useLightboxLayers, usePresentation, useTrialClock, validateConfigSchema };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map