@weasel-js/labkit 1.5.2 → 1.6.1

package/dist/chunk-CGHF6RZV.js

@@ -0,0 +1,300 @@
+import { useSurfaceOptional } from './chunk-WIG6XHJ7.js';
+import { CameraContext, pointerElsewhere, STAGE_VIEW_ID, normalize2DView, useCameraView, CameraScope, CameraInput } from './chunk-DWMSB4CA.js';
+import { resolveFrame, DEFAULT_FRAME } from './chunk-24W5VEJW.js';
+import { CanvasStackContext } from './chunk-CQLQPQ4P.js';
+import { useContext, useRef, useState, useEffect, useMemo } from 'react';
+import { usePointerPosition, crosshairRects, useVisibleRaf } from '@weasel-js/core';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ARMS = ["left", "right", "up", "down"];
+function LinkedCursor() {
+  const camera = useContext(CameraContext);
+  const pointer = usePointerPosition();
+  if (!camera) return null;
+  const local = pointerElsewhere(pointer, STAGE_VIEW_ID, camera.frame);
+  if (!local) return null;
+  const v = camera.view.get();
+  const x = (local.x - v.x) * v.scale.x;
+  const y = (local.y * camera.frame.yDir - v.y) * v.scale.y;
+  const { halo, bars } = crosshairRects(x, y, 1);
+  const arms = ARMS.map((name, i) => ({ name, halo: halo[i], bar: bars[i] }));
+  return /* @__PURE__ */ jsxs("svg", { className: "lk-linked-cursor", "aria-hidden": "true", children: [
+    arms.map(
+      ({ name, halo: r }) => r ? /* @__PURE__ */ jsx(
+        "rect",
+        {
+          className: "lk-linked-cursor__halo",
+          x: r.x,
+          y: r.y,
+          width: r.w,
+          height: r.h
+        },
+        `halo-${name}`
+      ) : null
+    ),
+    arms.map(
+      ({ name, bar: r }) => r ? /* @__PURE__ */ jsx(
+        "rect",
+        {
+          className: "lk-linked-cursor__bar",
+          x: r.x,
+          y: r.y,
+          width: r.w,
+          height: r.h
+        },
+        `bar-${name}`
+      ) : null
+    )
+  ] });
+}
+function useLayerScheduler({
+  layers,
+  view,
+  frame = DEFAULT_FRAME,
+  canvasRefs,
+  size,
+  host
+}) {
+  const dirty = useRef(/* @__PURE__ */ new Set());
+  const lastRenderRef = useRef(/* @__PURE__ */ new Map());
+  useEffect(() => {
+    for (const layer of layers) {
+      const prev = lastRenderRef.current.get(layer.id);
+      if (prev !== layer.render) dirty.current.add(layer.id);
+      lastRenderRef.current.set(layer.id, layer.render);
+    }
+    for (const id of [...lastRenderRef.current.keys()]) {
+      if (!layers.find((l) => l.id === id)) lastRenderRef.current.delete(id);
+    }
+  }, [layers]);
+  useEffect(() => {
+    for (const layer of layers) dirty.current.add(layer.id);
+  }, [view, frame, size, layers]);
+  const frameLoop = useVisibleRaf(
+    () => {
+      if (dirty.current.size === 0) return;
+      const map = canvasRefs.current;
+      if (!map) {
+        dirty.current.clear();
+        return;
+      }
+      for (const layer of layers) {
+        if (!dirty.current.has(layer.id)) continue;
+        if (!layer.visible) continue;
+        const canvas = map.get(layer.id);
+        if (!canvas) continue;
+        const ctx = canvas.getContext("2d");
+        if (!ctx) continue;
+        ctx.save();
+        ctx.setTransform(size.dpr, 0, 0, size.dpr, 0, 0);
+        ctx.clearRect(0, 0, size.width, size.height);
+        layer.render(ctx, view, frame);
+        ctx.restore();
+      }
+      dirty.current.clear();
+    },
+    { target: host }
+  );
+  useEffect(() => {
+    if (dirty.current.size > 0) frameLoop.request();
+  });
+}
+function CanvasStack({
+  layers,
+  view: viewProp,
+  onViewChange,
+  worldSpec,
+  minZoom,
+  maxZoom,
+  width = "100%",
+  height = "100%",
+  className,
+  onResize,
+  onHitTest,
+  children
+}) {
+  const view = normalize2DView(viewProp);
+  const containerRef = useRef(null);
+  const canvasMap = useRef(/* @__PURE__ */ new Map());
+  const [size, setSize] = useState({ width: 0, height: 0, dpr: 1 });
+  const setCanvasRef = (id, el) => {
+    if (el) canvasMap.current.set(id, el);
+    else canvasMap.current.delete(id);
+  };
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const update = () => {
+      const rect = el.getBoundingClientRect();
+      const dpr = window.devicePixelRatio ?? 1;
+      setSize((prev) => {
+        if (prev.width === rect.width && prev.height === rect.height && prev.dpr === dpr) {
+          return prev;
+        }
+        return { width: rect.width, height: rect.height, dpr };
+      });
+    };
+    update();
+    if (typeof ResizeObserver === "undefined") return;
+    const ro = new ResizeObserver(update);
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, []);
+  const onResizeRef = useRef(onResize);
+  onResizeRef.current = onResize;
+  useEffect(() => {
+    if (size.width === 0 && size.height === 0) return;
+    onResizeRef.current?.({ width: size.width, height: size.height });
+  }, [size.width, size.height]);
+  const frame = useMemo(() => resolveFrame(worldSpec, size), [worldSpec, size]);
+  const camera = useCameraView({
+    view: viewProp,
+    onViewChange,
+    frame,
+    hostRef: containerRef,
+    minZoom,
+    maxZoom
+  });
+  const cameraCtx = useMemo(
+    () => ({ view: camera, frame, element: () => containerRef.current }),
+    [camera, frame]
+  );
+  useLayerScheduler({ layers, view, frame, canvasRefs: canvasMap, size, host: containerRef });
+  const ctxValue = useMemo(
+    () => ({
+      view,
+      frame,
+      surface: { element: containerRef, size, canvases: canvasMap, layers }
+    }),
+    [view, frame, size, layers]
+  );
+  const containerStyle = { width, height };
+  const canvasPx = {
+    width: Math.max(0, Math.round(size.width * size.dpr)),
+    height: Math.max(0, Math.round(size.height * size.dpr))
+  };
+  const canvasCss = {
+    width: size.width,
+    height: size.height
+  };
+  return /* @__PURE__ */ jsx(CameraScope, { children: /* @__PURE__ */ jsx(CameraContext.Provider, { value: cameraCtx, children: /* @__PURE__ */ jsxs(CanvasStackContext.Provider, { value: ctxValue, children: [
+    /* @__PURE__ */ jsx(CameraInput, { hostRef: containerRef, camera, frame, onTap: onHitTest }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: containerRef,
+        className: className ? `lk-canvas-stack ${className}` : "lk-canvas-stack",
+        style: containerStyle,
+        children: [
+          layers.map((layer) => /* @__PURE__ */ jsx(
+            "canvas",
+            {
+              ref: (el) => setCanvasRef(layer.id, el),
+              className: "lk-canvas-stack__canvas",
+              width: canvasPx.width,
+              height: canvasPx.height,
+              style: { ...canvasCss, display: layer.visible ? "block" : "none" }
+            },
+            layer.id
+          )),
+          /* @__PURE__ */ jsx(LinkedCursor, {}),
+          /* @__PURE__ */ jsx("div", { className: "lk-canvas-stack__overlay", children })
+        ]
+      }
+    )
+  ] }) }) });
+}
+function fitStage(size, viewport) {
+  if (!(size.width > 0 && size.height > 0 && viewport.width > 0 && viewport.height > 0)) {
+    return { zoom: 1, pan: { x: 0, y: 0 } };
+  }
+  const zoom = Math.min(1, viewport.width / size.width, viewport.height / size.height);
+  return {
+    zoom,
+    pan: {
+      x: (viewport.width - size.width * zoom) / 2,
+      y: (viewport.height - size.height * zoom) / 2
+    }
+  };
+}
+function Stage({
+  size,
+  view: viewProp,
+  onViewChange,
+  minZoom,
+  maxZoom,
+  onResize,
+  hostRef,
+  overlay,
+  children
+}) {
+  const view = normalize2DView(viewProp);
+  const host = useRef(null);
+  const surface = useSurfaceOptional();
+  const camera = useCameraView({
+    view: viewProp,
+    onViewChange,
+    frame: DEFAULT_FRAME,
+    hostRef: host,
+    minZoom,
+    maxZoom
+  });
+  const cameraCtx = useMemo(
+    () => ({
+      view: camera,
+      frame: DEFAULT_FRAME,
+      element: () => host.current,
+      content: { x: 0, y: 0, width: size.width, height: size.height }
+    }),
+    [camera, size.width, size.height]
+  );
+  const onResizeRef = useRef(onResize);
+  onResizeRef.current = onResize;
+  useEffect(() => {
+    const el = host.current;
+    if (!el) return;
+    const measure = () => {
+      const rect = el.getBoundingClientRect();
+      if (rect.width > 0 && rect.height > 0) {
+        onResizeRef.current?.({ width: rect.width, height: rect.height });
+      }
+    };
+    measure();
+    if (typeof ResizeObserver === "undefined") return;
+    const ro = new ResizeObserver(measure);
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, []);
+  useEffect(() => {
+    surface?.invalidateRects();
+  }, [surface, view.zoom, view.pan.x, view.pan.y]);
+  const cameraVars = {
+    ["--lk-stage-x"]: `${view.pan.x}px`,
+    ["--lk-stage-y"]: `${view.pan.y}px`,
+    ["--lk-stage-zoom"]: String(view.zoom),
+    ["--lk-stage-w"]: `${size.width}px`,
+    ["--lk-stage-h"]: `${size.height}px`
+  };
+  return /* @__PURE__ */ jsx(CameraScope, { children: /* @__PURE__ */ jsxs(CameraContext.Provider, { value: cameraCtx, children: [
+    /* @__PURE__ */ jsx(CameraInput, { hostRef: host, camera, frame: DEFAULT_FRAME }),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: (el) => {
+          host.current = el;
+          if (hostRef) hostRef.current = el;
+        },
+        className: "lk-stage",
+        children: [
+          /* @__PURE__ */ jsx("div", { className: "lk-stage__content", style: cameraVars, children }),
+          /* @__PURE__ */ jsx(LinkedCursor, {}),
+          overlay
+        ]
+      }
+    )
+  ] }) });
+}
+
+export { CanvasStack, LinkedCursor, Stage, fitStage };
+//# sourceMappingURL=chunk-CGHF6RZV.js.map
+//# sourceMappingURL=chunk-CGHF6RZV.js.map

package/dist/chunk-CGHF6RZV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/canvas/LinkedCursor.tsx","../src/canvas/useLayerScheduler.ts","../src/canvas/CanvasStack.tsx","../src/canvas/Stage.tsx"],"names":["useRef","useEffect","jsx","jsxs","useMemo"],"mappings":";;;;;;;;AAKA,IAAM,IAAA,GAAO,CAAC,MAAA,EAAQ,OAAA,EAAS,MAAM,MAAM,CAAA;AAOpC,SAAS,YAAA,GAAe;AAC7B,EAAA,MAAM,MAAA,GAAS,WAAW,aAAa,CAAA;AACvC,EAAA,MAAM,UAAU,kBAAA,EAAmB;AACnC,EAAA,IAAI,CAAC,QAAQ,OAAO,IAAA;AACpB,EAAA,MAAM,KAAA,GAAQ,gBAAA,CAAiB,OAAA,EAAS,aAAA,EAAe,OAAO,KAAK,CAAA;AACnE,EAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AAGnB,EAAA,MAAM,CAAA,GAAI,MAAA,CAAO,IAAA,CAAK,GAAA,EAAI;AAC1B,EAAA,MAAM,KAAK,KAAA,CAAM,CAAA,GAAI,CAAA,CAAE,CAAA,IAAK,EAAE,KAAA,CAAM,CAAA;AACpC,EAAA,MAAM,CAAA,GAAA,CAAK,MAAM,CAAA,GAAI,MAAA,CAAO,MAAM,IAAA,GAAO,CAAA,CAAE,CAAA,IAAK,CAAA,CAAE,KAAA,CAAM,CAAA;AACxD,EAAA,MAAM,EAAE,IAAA,EAAM,IAAA,KAAS,cAAA,CAAe,CAAA,EAAG,GAAG,CAAC,CAAA;AAC7C,EAAA,MAAM,OAAO,IAAA,CAAK,GAAA,CAAI,CAAC,IAAA,EAAM,OAAO,EAAE,IAAA,EAAM,IAAA,EAAM,IAAA,CAAK,CAAC,CAAA,EAAG,GAAA,EAAK,IAAA,CAAK,CAAC,GAAE,CAAE,CAAA;AAC1E,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,kBAAA,EAAmB,eAAY,MAAA,EAC3C,QAAA,EAAA;AAAA,IAAA,IAAA,CAAK,GAAA;AAAA,MAAI,CAAC,EAAE,IAAA,EAAM,IAAA,EAAM,CAAA,OACvB,CAAA,mBACE,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UAEC,SAAA,EAAU,wBAAA;AAAA,UACV,GAAG,CAAA,CAAE,CAAA;AAAA,UACL,GAAG,CAAA,CAAE,CAAA;AAAA,UACL,OAAO,CAAA,CAAE,CAAA;AAAA,UACT,QAAQ,CAAA,CAAE;AAAA,SAAA;AAAA,QALL,QAAQ,IAAI,CAAA;AAAA,OAMnB,GACE;AAAA,KACN;AAAA,IACC,IAAA,CAAK,GAAA;AAAA,MAAI,CAAC,EAAE,IAAA,EAAM,GAAA,EAAK,CAAA,OACtB,CAAA,mBACE,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UAEC,SAAA,EAAU,uBAAA;AAAA,UACV,GAAG,CAAA,CAAE,CAAA;AAAA,UACL,GAAG,CAAA,CAAE,CAAA;AAAA,UACL,OAAO,CAAA,CAAE,CAAA;AAAA,UACT,QAAQ,CAAA,CAAE;AAAA,SAAA;AAAA,QALL,OAAO,IAAI,CAAA;AAAA,OAMlB,GACE;AAAA;AACN,GAAA,EACF,CAAA;AAEJ;AC5BO,SAAS,iBAAA,CAAkB;AAAA,EAChC,MAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA,GAAQ,aAAA;AAAA,EACR,UAAA;AAAA,EACA,IAAA;AAAA,EACA;AACF,CAAA,EAA2B;AACzB,EAAA,MAAM,KAAA,GAAQ,MAAA,iBAAoB,IAAI,GAAA,EAAK,CAAA;AAC3C,EAAA,MAAM,aAAA,GAAgB,MAAA,iBAAqD,IAAI,GAAA,EAAK,CAAA;AAEpF,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,KAAA,MAAW,SAAS,MAAA,EAAQ;AAC1B,MAAA,MAAM,IAAA,GAAO,aAAA,CAAc,OAAA,CAAQ,GAAA,CAAI,MAAM,EAAE,CAAA;AAC/C,MAAA,IAAI,SAAS,KAAA,CAAM,MAAA,QAAc,OAAA,CAAQ,GAAA,CAAI,MAAM,EAAE,CAAA;AACrD,MAAA,aAAA,CAAc,OAAA,CAAQ,GAAA,CAAI,KAAA,CAAM,EAAA,EAAI,MAAM,MAAM,CAAA;AAAA,IAClD;AACA,IAAA,KAAA,MAAW,MAAM,CAAC,GAAG,cAAc,OAAA,CAAQ,IAAA,EAAM,CAAA,EAAG;AAClD,MAAA,IAAI,CAAC,MAAA,CAAO,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,EAAA,KAAO,EAAE,CAAA,EAAG,aAAA,CAAc,OAAA,CAAQ,MAAA,CAAO,EAAE,CAAA;AAAA,IACvE;AAAA,EACF,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAGX,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,KAAA,MAAW,SAAS,MAAA,EAAQ,KAAA,CAAM,OAAA,CAAQ,GAAA,CAAI,MAAM,EAAE,CAAA;AAAA,EACxD,GAAG,CAAC,IAAA,EAAM,KAAA,EAAO,IAAA,EAAM,MAAM,CAAC,CAAA;AAK9B,EAAA,MAAM,SAAA,GAAY,aAAA;AAAA,IAChB,MAAM;AACJ,MAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,IAAA,KAAS,CAAA,EAAG;AAC9B,MAAA,MAAM,MAAM,UAAA,CAAW,OAAA;AACvB,MAAA,IAAI,CAAC,GAAA,EAAK;AACR,QAAA,KAAA,CAAM,QAAQ,KAAA,EAAM;AACpB,QAAA;AAAA,MACF;AACA,MAAA,KAAA,MAAW,SAAS,MAAA,EAAQ;AAC1B,QAAA,IAAI,CAAC,KAAA,CAAM,OAAA,CAAQ,GAAA,CAAI,KAAA,CAAM,EAAE,CAAA,EAAG;AAClC,QAAA,IAAI,CAAC,MAAM,OAAA,EAAS;AACpB,QAAA,MAAM,MAAA,GAAS,GAAA,CAAI,GAAA,CAAI,KAAA,CAAM,EAAE,CAAA;AAC/B,QAAA,IAAI,CAAC,MAAA,EAAQ;AACb,QAAA,MAAM,GAAA,GAAM,MAAA,CAAO,UAAA,CAAW,IAAI,CAAA;AAClC,QAAA,IAAI,CAAC,GAAA,EAAK;AACV,QAAA,GAAA,CAAI,IAAA,EAAK;AACT,QAAA,GAAA,CAAI,YAAA,CAAa,KAAK,GAAA,EAAK,CAAA,EAAG,GAAG,IAAA,CAAK,GAAA,EAAK,GAAG,CAAC,CAAA;AAC/C,QAAA,GAAA,CAAI,UAAU,CAAA,EAAG,CAAA,EAAG,IAAA,CAAK,KAAA,EAAO,KAAK,MAAM,CAAA;AAC3C,QAAA,KAAA,CAAM,MAAA,CAAO,GAAA,EAAK,IAAA,EAAM,KAAK,CAAA;AAC7B,QAAA,GAAA,CAAI,OAAA,EAAQ;AAAA,MACd;AACA,MAAA,KAAA,CAAM,QAAQ,KAAA,EAAM;AAAA,IACtB,CAAA;AAAA,IACA,EAAE,QAAQ,IAAA;AAAK,GACjB;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,IAAA,GAAO,CAAA,YAAa,OAAA,EAAQ;AAAA,EAChD,CAAC,CAAA;AACH;ACnDO,SAAS,WAAA,CAAY;AAAA,EAC1B,MAAA;AAAA,EACA,IAAA,EAAM,QAAA;AAAA,EACN,YAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,GAAQ,MAAA;AAAA,EACR,MAAA,GAAS,MAAA;AAAA,EACT,SAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAAqB;AACnB,EAAA,MAAM,IAAA,GAAO,gBAAgB,QAAQ,CAAA;AACrC,EAAA,MAAM,YAAA,GAAeA,OAA8B,IAAI,CAAA;AACvD,EAAA,MAAM,SAAA,GAAYA,MAAAA,iBAAuC,IAAI,GAAA,EAAK,CAAA;AAClE,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,QAAA,CAAS,EAAE,KAAA,EAAO,CAAA,EAAG,MAAA,EAAQ,CAAA,EAAG,GAAA,EAAK,CAAA,EAAG,CAAA;AAEhE,EAAA,MAAM,YAAA,GAAe,CAAC,EAAA,EAAY,EAAA,KAAuC;AACvE,IAAA,IAAI,EAAA,EAAI,SAAA,CAAU,OAAA,CAAQ,GAAA,CAAI,IAAI,EAAE,CAAA;AAAA,SAC/B,SAAA,CAAU,OAAA,CAAQ,MAAA,CAAO,EAAE,CAAA;AAAA,EAClC,CAAA;AAEA,EAAAC,UAAU,MAAM;AACd,IAAA,MAAM,KAAK,YAAA,CAAa,OAAA;AACxB,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,MAAM,SAAS,MAAM;AACnB,MAAA,MAAM,IAAA,GAAO,GAAG,qBAAA,EAAsB;AACtC,MAAA,MAAM,GAAA,GAAM,OAAO,gBAAA,IAAoB,CAAA;AACvC,MAAA,OAAA,CAAQ,CAAC,IAAA,KAAS;AAChB,QAAA,IAAI,IAAA,CAAK,KAAA,KAAU,IAAA,CAAK,KAAA,IAAS,IAAA,CAAK,WAAW,IAAA,CAAK,MAAA,IAAU,IAAA,CAAK,GAAA,KAAQ,GAAA,EAAK;AAChF,UAAA,OAAO,IAAA;AAAA,QACT;AACA,QAAA,OAAO,EAAE,KAAA,EAAO,IAAA,CAAK,OAAO,MAAA,EAAQ,IAAA,CAAK,QAAQ,GAAA,EAAI;AAAA,MACvD,CAAC,CAAA;AAAA,IACH,CAAA;AACA,IAAA,MAAA,EAAO;AACP,IAAA,IAAI,OAAO,mBAAmB,WAAA,EAAa;AAC3C,IAAA,MAAM,EAAA,GAAK,IAAI,cAAA,CAAe,MAAM,CAAA;AACpC,IAAA,EAAA,CAAG,QAAQ,EAAE,CAAA;AACb,IAAA,OAAO,MAAM,GAAG,UAAA,EAAW;AAAA,EAC7B,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,WAAA,GAAcD,OAAO,QAAQ,CAAA;AACnC,EAAA,WAAA,CAAY,OAAA,GAAU,QAAA;AACtB,EAAAC,UAAU,MAAM;AACd,IAAA,IAAI,IAAA,CAAK,KAAA,KAAU,CAAA,IAAK,IAAA,CAAK,WAAW,CAAA,EAAG;AAC3C,IAAA,WAAA,CAAY,OAAA,GAAU,EAAE,KAAA,EAAO,IAAA,CAAK,OAAO,MAAA,EAAQ,IAAA,CAAK,QAAQ,CAAA;AAAA,EAClE,GAAG,CAAC,IAAA,CAAK,KAAA,EAAO,IAAA,CAAK,MAAM,CAAC,CAAA;AAE5B,EAAA,MAAM,KAAA,GAAQ,OAAA,CAAQ,MAAM,YAAA,CAAa,SAAA,EAAW,IAAI,CAAA,EAAG,CAAC,SAAA,EAAW,IAAI,CAAC,CAAA;AAE5E,EAAA,MAAM,SAAS,aAAA,CAAc;AAAA,IAC3B,IAAA,EAAM,QAAA;AAAA,IACN,YAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA,EAAS,YAAA;AAAA,IACT,OAAA;AAAA,IACA;AAAA,GACD,CAAA;AACD,EAAA,MAAM,SAAA,GAAY,OAAA;AAAA,IAChB,OAAO,EAAE,IAAA,EAAM,MAAA,EAAQ,OAAO,OAAA,EAAS,MAAM,aAAa,OAAA,EAAQ,CAAA;AAAA,IAClE,CAAC,QAAQ,KAAK;AAAA,GAChB;AACA,EAAA,iBAAA,CAAkB,EAAE,QAAQ,IAAA,EAAM,KAAA,EAAO,YAAY,SAAA,EAAW,IAAA,EAAM,IAAA,EAAM,YAAA,EAAc,CAAA;AAE1F,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA,IACf,OAAO;AAAA,MACL,IAAA;AAAA,MACA,KAAA;AAAA,MACA,SAAS,EAAE,OAAA,EAAS,cAAc,IAAA,EAAM,QAAA,EAAU,WAAW,MAAA;AAAO,KACtE,CAAA;AAAA,IACA,CAAC,IAAA,EAAM,KAAA,EAAO,IAAA,EAAM,MAAM;AAAA,GAC5B;AAEA,EAAA,MAAM,cAAA,GAAgC,EAAE,KAAA,EAAO,MAAA,EAAO;AACtD,EAAA,MAAM,QAAA,GAAW;AAAA,IACf,KAAA,EAAO,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,IAAA,CAAK,MAAM,IAAA,CAAK,KAAA,GAAQ,IAAA,CAAK,GAAG,CAAC,CAAA;AAAA,IACpD,MAAA,EAAQ,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,IAAA,CAAK,MAAM,IAAA,CAAK,MAAA,GAAS,IAAA,CAAK,GAAG,CAAC;AAAA,GACxD;AACA,EAAA,MAAM,SAAA,GAA2B;AAAA,IAC/B,OAAO,IAAA,CAAK,KAAA;AAAA,IACZ,QAAQ,IAAA,CAAK;AAAA,GACf;AAEA,EAAA,uBACEC,GAAAA,CAAC,WAAA,EAAA,EACC,QAAA,kBAAAA,GAAAA,CAAC,cAAc,QAAA,EAAd,EAAuB,KAAA,EAAO,SAAA,EAC7B,0BAAAC,IAAAA,CAAC,kBAAA,CAAmB,QAAA,EAAnB,EAA4B,OAAO,QAAA,EAClC,QAAA,EAAA;AAAA,oBAAAD,IAAC,WAAA,EAAA,EAAY,OAAA,EAAS,cAAc,MAAA,EAAgB,KAAA,EAAc,OAAO,SAAA,EAAW,CAAA;AAAA,oBACpFC,IAAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,YAAA;AAAA,QACL,SAAA,EAAW,SAAA,GAAY,CAAA,gBAAA,EAAmB,SAAS,CAAA,CAAA,GAAK,iBAAA;AAAA,QACxD,KAAA,EAAO,cAAA;AAAA,QAEN,QAAA,EAAA;AAAA,UAAA,MAAA,CAAO,GAAA,CAAI,CAAC,KAAA,qBACXD,GAAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cAEC,KAAK,CAAC,EAAA,KAAO,YAAA,CAAa,KAAA,CAAM,IAAI,EAAE,CAAA;AAAA,cACtC,SAAA,EAAU,yBAAA;AAAA,cACV,OAAO,QAAA,CAAS,KAAA;AAAA,cAChB,QAAQ,QAAA,CAAS,MAAA;AAAA,cACjB,KAAA,EAAO,EAAE,GAAG,SAAA,EAAW,SAAS,KAAA,CAAM,OAAA,GAAU,UAAU,MAAA;AAAO,aAAA;AAAA,YAL5D,KAAA,CAAM;AAAA,WAOd,CAAA;AAAA,0BACDA,IAAC,YAAA,EAAA,EAAa,CAAA;AAAA,0BACdA,GAAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4BAA4B,QAAA,EAAS;AAAA;AAAA;AAAA;AACtD,GAAA,EACF,GACF,CAAA,EACF,CAAA;AAEJ;ACrHO,SAAS,QAAA,CAAS,MAAoB,QAAA,EAAuC;AAClF,EAAA,IAAI,EAAE,IAAA,CAAK,KAAA,GAAQ,CAAA,IAAK,IAAA,CAAK,MAAA,GAAS,CAAA,IAAK,QAAA,CAAS,KAAA,GAAQ,CAAA,IAAK,QAAA,CAAS,MAAA,GAAS,CAAA,CAAA,EAAI;AACrF,IAAA,OAAO,EAAE,MAAM,CAAA,EAAG,GAAA,EAAK,EAAE,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,CAAA,EAAE,EAAE;AAAA,EACxC;AACA,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,QAAA,CAAS,KAAA,GAAQ,IAAA,CAAK,KAAA,EAAO,QAAA,CAAS,MAAA,GAAS,IAAA,CAAK,MAAM,CAAA;AACnF,EAAA,OAAO;AAAA,IACL,IAAA;AAAA,IACA,GAAA,EAAK;AAAA,MACH,CAAA,EAAA,CAAI,QAAA,CAAS,KAAA,GAAQ,IAAA,CAAK,QAAQ,IAAA,IAAQ,CAAA;AAAA,MAC1C,CAAA,EAAA,CAAI,QAAA,CAAS,MAAA,GAAS,IAAA,CAAK,SAAS,IAAA,IAAQ;AAAA;AAC9C,GACF;AACF;AASO,SAAS,KAAA,CAAM;AAAA,EACpB,IAAA;AAAA,EACA,IAAA,EAAM,QAAA;AAAA,EACN,YAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAA,EAAe;AACb,EAAA,MAAM,IAAA,GAAO,gBAAgB,QAAQ,CAAA;AACrC,EAAA,MAAM,IAAA,GAAOF,OAA8B,IAAI,CAAA;AAC/C,EAAA,MAAM,UAAU,kBAAA,EAAmB;AACnC,EAAA,MAAM,SAAS,aAAA,CAAc;AAAA,IAC3B,IAAA,EAAM,QAAA;AAAA,IACN,YAAA;AAAA,IACA,KAAA,EAAO,aAAA;AAAA,IACP,OAAA,EAAS,IAAA;AAAA,IACT,OAAA;AAAA,IACA;AAAA,GACD,CAAA;AACD,EAAA,MAAM,SAAA,GAAYI,OAAAA;AAAA,IAChB,OAAO;AAAA,MACL,IAAA,EAAM,MAAA;AAAA,MACN,KAAA,EAAO,aAAA;AAAA,MACP,OAAA,EAAS,MAAM,IAAA,CAAK,OAAA;AAAA,MACpB,OAAA,EAAS,EAAE,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,CAAA,EAAG,KAAA,EAAO,IAAA,CAAK,KAAA,EAAO,MAAA,EAAQ,IAAA,CAAK,MAAA;AAAO,KAChE,CAAA;AAAA,IACA,CAAC,MAAA,EAAQ,IAAA,CAAK,KAAA,EAAO,KAAK,MAAM;AAAA,GAClC;AAEA,EAAA,MAAM,WAAA,GAAcJ,OAAO,QAAQ,CAAA;AACnC,EAAA,WAAA,CAAY,OAAA,GAAU,QAAA;AACtB,EAAAC,UAAU,MAAM;AACd,IAAA,MAAM,KAAK,IAAA,CAAK,OAAA;AAChB,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,MAAM,UAAU,MAAM;AACpB,MAAA,MAAM,IAAA,GAAO,GAAG,qBAAA,EAAsB;AACtC,MAAA,IAAI,IAAA,CAAK,KAAA,GAAQ,CAAA,IAAK,IAAA,CAAK,SAAS,CAAA,EAAG;AACrC,QAAA,WAAA,CAAY,OAAA,GAAU,EAAE,KAAA,EAAO,IAAA,CAAK,OAAO,MAAA,EAAQ,IAAA,CAAK,QAAQ,CAAA;AAAA,MAClE;AAAA,IACF,CAAA;AACA,IAAA,OAAA,EAAQ;AACR,IAAA,IAAI,OAAO,mBAAmB,WAAA,EAAa;AAC3C,IAAA,MAAM,EAAA,GAAK,IAAI,cAAA,CAAe,OAAO,CAAA;AACrC,IAAA,EAAA,CAAG,QAAQ,EAAE,CAAA;AACb,IAAA,OAAO,MAAM,GAAG,UAAA,EAAW;AAAA,EAC7B,CAAA,EAAG,EAAE,CAAA;AAKL,EAAAA,UAAU,MAAM;AACd,IAAA,OAAA,EAAS,eAAA,EAAgB;AAAA,EAC3B,CAAA,EAAG,CAAC,OAAA,EAAS,IAAA,CAAK,IAAA,EAAM,IAAA,CAAK,GAAA,CAAI,CAAA,EAAG,IAAA,CAAK,GAAA,CAAI,CAAC,CAAC,CAAA;AAK/C,EAAA,MAAM,UAAA,GAAa;AAAA,IACjB,CAAC,cAAwB,GAAG,CAAA,EAAG,IAAA,CAAK,IAAI,CAAC,CAAA,EAAA,CAAA;AAAA,IACzC,CAAC,cAAwB,GAAG,CAAA,EAAG,IAAA,CAAK,IAAI,CAAC,CAAA,EAAA,CAAA;AAAA,IACzC,CAAC,iBAA2B,GAAG,MAAA,CAAO,KAAK,IAAI,CAAA;AAAA,IAC/C,CAAC,cAAwB,GAAG,CAAA,EAAG,KAAK,KAAK,CAAA,EAAA,CAAA;AAAA,IACzC,CAAC,cAAwB,GAAG,CAAA,EAAG,KAAK,MAAM,CAAA,EAAA;AAAA,GAC5C;AAEA,EAAA,uBACEC,IAAC,WAAA,EAAA,EACC,QAAA,kBAAAC,KAAC,aAAA,CAAc,QAAA,EAAd,EAAuB,KAAA,EAAO,SAAA,EAC7B,QAAA,EAAA;AAAA,oBAAAD,IAAC,WAAA,EAAA,EAAY,OAAA,EAAS,IAAA,EAAM,MAAA,EAAgB,OAAO,aAAA,EAAe,CAAA;AAAA,oBAClEC,IAAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,CAAC,EAAA,KAAO;AACX,UAAA,IAAA,CAAK,OAAA,GAAU,EAAA;AACf,UAAA,IAAI,OAAA,UAAiB,OAAA,GAAU,EAAA;AAAA,QACjC,CAAA;AAAA,QACA,SAAA,EAAU,UAAA;AAAA,QAEV,QAAA,EAAA;AAAA,0BAAAD,IAAC,KAAA,EAAA,EAAI,SAAA,EAAU,mBAAA,EAAoB,KAAA,EAAO,YACvC,QAAA,EACH,CAAA;AAAA,0BACAA,IAAC,YAAA,EAAA,EAAa,CAAA;AAAA,UACb;AAAA;AAAA;AAAA;AACH,GAAA,EACF,CAAA,EACF,CAAA;AAEJ","file":"chunk-CGHF6RZV.js","sourcesContent":["import { crosshairRects, usePointerPosition } from '@weasel-js/core';\nimport { useContext } from 'react';\nimport { CameraContext, pointerElsewhere, STAGE_VIEW_ID } from './CameraInput';\n\n/** `crosshairRects` returns its four arms in this order. */\nconst ARMS = ['left', 'right', 'up', 'down'] as const;\n\n/**\n * The other side of a linked cursor: a crosshair on the camera's own element\n * wherever the shared pointer is over some other view — an overview, say. The\n * same crosshair core paints on a weasel canvas.\n */\nexport function LinkedCursor() {\n  const camera = useContext(CameraContext);\n  const pointer = usePointerPosition();\n  if (!camera) return null;\n  const local = pointerElsewhere(pointer, STAGE_VIEW_ID, camera.frame);\n  if (!local) return null;\n  // `pointerElsewhere` hands back the instrument's world; the camera works\n  // frame-local, and the map is its own inverse.\n  const v = camera.view.get();\n  const x = (local.x - v.x) * v.scale.x;\n  const y = (local.y * camera.frame.yDir - v.y) * v.scale.y;\n  const { halo, bars } = crosshairRects(x, y, 1);\n  const arms = ARMS.map((name, i) => ({ name, halo: halo[i], bar: bars[i] }));\n  return (\n    <svg className=\"lk-linked-cursor\" aria-hidden=\"true\">\n      {arms.map(({ name, halo: r }) =>\n        r ? (\n          <rect\n            key={`halo-${name}`}\n            className=\"lk-linked-cursor__halo\"\n            x={r.x}\n            y={r.y}\n            width={r.w}\n            height={r.h}\n          />\n        ) : null,\n      )}\n      {arms.map(({ name, bar: r }) =>\n        r ? (\n          <rect\n            key={`bar-${name}`}\n            className=\"lk-linked-cursor__bar\"\n            x={r.x}\n            y={r.y}\n            width={r.w}\n            height={r.h}\n          />\n        ) : null,\n      )}\n    </svg>\n  );\n}\n","import { useVisibleRaf } from '@weasel-js/core';\nimport { type RefObject, useEffect, useRef } from 'react';\nimport type { ViewTransform } from '../instrument/types';\nimport { DEFAULT_FRAME, type WorldFrame } from './worldSpec';\n\n/** One layer of a canvas stack: its id, whether it is currently shown, and how\n *  it paints itself. */\nexport interface CanvasLayerDescriptor {\n  id: string;\n  visible: boolean;\n  render: (ctx: CanvasRenderingContext2D, view: ViewTransform, frame: WorldFrame) => void;\n}\n\ninterface SchedulerOptions {\n  layers: CanvasLayerDescriptor[];\n  view: ViewTransform;\n  /** The instrument's coordinate system, resolved against `size`. */\n  frame?: WorldFrame;\n  canvasRefs: RefObject<Map<string, HTMLCanvasElement>>;\n  size: { width: number; height: number; dpr: number };\n  /** The element the stack occupies. Given one, the scheduler also stops while\n   *  the stack sits outside the viewport. */\n  host?: RefObject<Element | null>;\n}\n\nexport function useLayerScheduler({\n  layers,\n  view,\n  frame = DEFAULT_FRAME,\n  canvasRefs,\n  size,\n  host,\n}: SchedulerOptions): void {\n  const dirty = useRef<Set<string>>(new Set());\n  const lastRenderRef = useRef<Map<string, CanvasLayerDescriptor['render']>>(new Map());\n\n  useEffect(() => {\n    for (const layer of layers) {\n      const prev = lastRenderRef.current.get(layer.id);\n      if (prev !== layer.render) dirty.current.add(layer.id);\n      lastRenderRef.current.set(layer.id, layer.render);\n    }\n    for (const id of [...lastRenderRef.current.keys()]) {\n      if (!layers.find((l) => l.id === id)) lastRenderRef.current.delete(id);\n    }\n  }, [layers]);\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: re-mark dirty when view or size changes\n  useEffect(() => {\n    for (const layer of layers) dirty.current.add(layer.id);\n  }, [view, frame, size, layers]);\n\n  // Painting only what is dirty is not the same as doing nothing: a hidden tab\n  // still commits React updates, and the effect above marks every layer dirty\n  // on any view or size change. The gate is what actually stops the work.\n  const frameLoop = useVisibleRaf(\n    () => {\n      if (dirty.current.size === 0) return;\n      const map = canvasRefs.current;\n      if (!map) {\n        dirty.current.clear();\n        return;\n      }\n      for (const layer of layers) {\n        if (!dirty.current.has(layer.id)) continue;\n        if (!layer.visible) continue;\n        const canvas = map.get(layer.id);\n        if (!canvas) continue;\n        const ctx = canvas.getContext('2d');\n        if (!ctx) continue;\n        ctx.save();\n        ctx.setTransform(size.dpr, 0, 0, size.dpr, 0, 0);\n        ctx.clearRect(0, 0, size.width, size.height);\n        layer.render(ctx, view, frame);\n        ctx.restore();\n      }\n      dirty.current.clear();\n    },\n    { target: host },\n  );\n\n  useEffect(() => {\n    if (dirty.current.size > 0) frameLoop.request();\n  });\n}\n","import { type CSSProperties, type ReactNode, useEffect, useMemo, useRef, useState } from 'react';\nimport type { Point, ViewTransform } from '../instrument/types';\nimport { normalize2DView } from '../state/view';\nimport { CameraContext, CameraInput, CameraScope, useCameraView } from './CameraInput';\nimport { CanvasStackContext } from './CanvasStackContext';\nimport { LinkedCursor } from './LinkedCursor';\nimport { type CanvasLayerDescriptor, useLayerScheduler } from './useLayerScheduler';\nimport { resolveFrame, type ViewportSize, type WorldSpec } from './worldSpec';\n\n/** Props for `<CanvasStack>`. */\nexport interface CanvasStackProps {\n  layers: CanvasLayerDescriptor[];\n  view: ViewTransform;\n  onViewChange: (v: ViewTransform) => void;\n  /** The instrument's coordinate system. Omitted, world (0,0) sits at the\n   *  element's top-left with y running down. */\n  worldSpec?: WorldSpec;\n  minZoom?: number;\n  maxZoom?: number;\n  width?: number | string;\n  height?: number | string;\n  className?: string;\n  /** Fired whenever the stack is measured, so a consumer can place a view that\n   *  only makes sense in terms of the viewport. */\n  onResize?: (size: ViewportSize) => void;\n  onHitTest?: (worldPos: Point) => void;\n  children?: ReactNode;\n}\n\n/** Stacks one `<canvas>` per layer and drives them from a shared view, so a\n *  layer that changes rarely is not redrawn with one that changes every frame.\n *  Handles sizing and device pixel ratio; pan and zoom route through weasel's\n *  gesture dispatcher (`<CameraInput>`). */\nexport function CanvasStack({\n  layers,\n  view: viewProp,\n  onViewChange,\n  worldSpec,\n  minZoom,\n  maxZoom,\n  width = '100%',\n  height = '100%',\n  className,\n  onResize,\n  onHitTest,\n  children,\n}: CanvasStackProps) {\n  const view = normalize2DView(viewProp);\n  const containerRef = useRef<HTMLDivElement | null>(null);\n  const canvasMap = useRef<Map<string, HTMLCanvasElement>>(new Map());\n  const [size, setSize] = useState({ width: 0, height: 0, dpr: 1 });\n\n  const setCanvasRef = (id: string, el: HTMLCanvasElement | null): void => {\n    if (el) canvasMap.current.set(id, el);\n    else canvasMap.current.delete(id);\n  };\n\n  useEffect(() => {\n    const el = containerRef.current;\n    if (!el) return;\n    const update = () => {\n      const rect = el.getBoundingClientRect();\n      const dpr = window.devicePixelRatio ?? 1;\n      setSize((prev) => {\n        if (prev.width === rect.width && prev.height === rect.height && prev.dpr === dpr) {\n          return prev;\n        }\n        return { width: rect.width, height: rect.height, dpr };\n      });\n    };\n    update();\n    if (typeof ResizeObserver === 'undefined') return;\n    const ro = new ResizeObserver(update);\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, []);\n\n  const onResizeRef = useRef(onResize);\n  onResizeRef.current = onResize;\n  useEffect(() => {\n    if (size.width === 0 && size.height === 0) return;\n    onResizeRef.current?.({ width: size.width, height: size.height });\n  }, [size.width, size.height]);\n\n  const frame = useMemo(() => resolveFrame(worldSpec, size), [worldSpec, size]);\n\n  const camera = useCameraView({\n    view: viewProp,\n    onViewChange,\n    frame,\n    hostRef: containerRef,\n    minZoom,\n    maxZoom,\n  });\n  const cameraCtx = useMemo(\n    () => ({ view: camera, frame, element: () => containerRef.current }),\n    [camera, frame],\n  );\n  useLayerScheduler({ layers, view, frame, canvasRefs: canvasMap, size, host: containerRef });\n\n  const ctxValue = useMemo(\n    () => ({\n      view,\n      frame,\n      surface: { element: containerRef, size, canvases: canvasMap, layers },\n    }),\n    [view, frame, size, layers],\n  );\n\n  const containerStyle: CSSProperties = { width, height };\n  const canvasPx = {\n    width: Math.max(0, Math.round(size.width * size.dpr)),\n    height: Math.max(0, Math.round(size.height * size.dpr)),\n  };\n  const canvasCss: CSSProperties = {\n    width: size.width,\n    height: size.height,\n  };\n\n  return (\n    <CameraScope>\n      <CameraContext.Provider value={cameraCtx}>\n        <CanvasStackContext.Provider value={ctxValue}>\n          <CameraInput hostRef={containerRef} camera={camera} frame={frame} onTap={onHitTest} />\n          <div\n            ref={containerRef}\n            className={className ? `lk-canvas-stack ${className}` : 'lk-canvas-stack'}\n            style={containerStyle}\n          >\n            {layers.map((layer) => (\n              <canvas\n                key={layer.id}\n                ref={(el) => setCanvasRef(layer.id, el)}\n                className=\"lk-canvas-stack__canvas\"\n                width={canvasPx.width}\n                height={canvasPx.height}\n                style={{ ...canvasCss, display: layer.visible ? 'block' : 'none' }}\n              />\n            ))}\n            <LinkedCursor />\n            <div className=\"lk-canvas-stack__overlay\">{children}</div>\n          </div>\n        </CanvasStackContext.Provider>\n      </CameraContext.Provider>\n    </CameraScope>\n  );\n}\n","import { type CSSProperties, type ReactNode, useEffect, useMemo, useRef } from 'react';\nimport type { ViewTransform } from '../instrument/types';\nimport { normalize2DView } from '../state/view';\nimport { useSurfaceOptional } from '../surface/useSurfaceTile';\nimport { CameraContext, CameraInput, CameraScope, useCameraView } from './CameraInput';\nimport { LinkedCursor } from './LinkedCursor';\nimport { DEFAULT_FRAME, type ViewportSize } from './worldSpec';\n\n/** Props for `<Stage>`. */\nexport interface StageProps {\n  /** The content's own size in CSS pixels, at zoom 1. */\n  size: ViewportSize;\n  view: ViewTransform;\n  onViewChange: (v: ViewTransform) => void;\n  minZoom?: number;\n  maxZoom?: number;\n  /** Fired whenever the stage's viewport is measured at a non-zero size. */\n  onResize?: (viewport: ViewportSize) => void;\n  /** Handed the viewport element, for a consumer tracking the pointer over it. */\n  hostRef?: { current: HTMLDivElement | null };\n  /** Drawn over the content in viewport pixels, outside the camera. */\n  overlay?: ReactNode;\n  children?: ReactNode;\n}\n\n/**\n * The camera a stage opens at: the content centered in its viewport, shrunk to\n * fit if it has to be and never enlarged past its own size.\n */\nexport function fitStage(size: ViewportSize, viewport: ViewportSize): ViewTransform {\n  if (!(size.width > 0 && size.height > 0 && viewport.width > 0 && viewport.height > 0)) {\n    return { zoom: 1, pan: { x: 0, y: 0 } };\n  }\n  const zoom = Math.min(1, viewport.width / size.width, viewport.height / size.height);\n  return {\n    zoom,\n    pan: {\n      x: (viewport.width - size.width * zoom) / 2,\n      y: (viewport.height - size.height * zoom) / 2,\n    },\n  };\n}\n\n/**\n * DOM content of a fixed size, panned and zoomed by a camera — what\n * `<CanvasStack>` is for layers drawn to a canvas. Pan and zoom route through\n * weasel's gesture dispatcher (`<CameraInput>`). The content is laid out at\n * its own size and transformed, so everything inside keeps its layout and a\n * measurement of any element in it reports where it is actually drawn.\n */\nexport function Stage({\n  size,\n  view: viewProp,\n  onViewChange,\n  minZoom,\n  maxZoom,\n  onResize,\n  hostRef,\n  overlay,\n  children,\n}: StageProps) {\n  const view = normalize2DView(viewProp);\n  const host = useRef<HTMLDivElement | null>(null);\n  const surface = useSurfaceOptional();\n  const camera = useCameraView({\n    view: viewProp,\n    onViewChange,\n    frame: DEFAULT_FRAME,\n    hostRef: host,\n    minZoom,\n    maxZoom,\n  });\n  const cameraCtx = useMemo(\n    () => ({\n      view: camera,\n      frame: DEFAULT_FRAME,\n      element: () => host.current,\n      content: { x: 0, y: 0, width: size.width, height: size.height },\n    }),\n    [camera, size.width, size.height],\n  );\n\n  const onResizeRef = useRef(onResize);\n  onResizeRef.current = onResize;\n  useEffect(() => {\n    const el = host.current;\n    if (!el) return;\n    const measure = () => {\n      const rect = el.getBoundingClientRect();\n      if (rect.width > 0 && rect.height > 0) {\n        onResizeRef.current?.({ width: rect.width, height: rect.height });\n      }\n    };\n    measure();\n    if (typeof ResizeObserver === 'undefined') return;\n    const ro = new ResizeObserver(measure);\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, []);\n\n  // A transform moves every tile inside the content without resizing anything,\n  // and a ResizeObserver reports only resizes.\n  // biome-ignore lint/correctness/useExhaustiveDependencies: the camera is the trigger, not an input — the effect re-measures whenever it moves.\n  useEffect(() => {\n    surface?.invalidateRects();\n  }, [surface, view.zoom, view.pan.x, view.pan.y]);\n\n  // The camera changes every frame of a pan, and a transform has nowhere to\n  // live but the element's own style: set as custom properties the stylesheet\n  // reads.\n  const cameraVars = {\n    ['--lk-stage-x' as string]: `${view.pan.x}px`,\n    ['--lk-stage-y' as string]: `${view.pan.y}px`,\n    ['--lk-stage-zoom' as string]: String(view.zoom),\n    ['--lk-stage-w' as string]: `${size.width}px`,\n    ['--lk-stage-h' as string]: `${size.height}px`,\n  } as CSSProperties;\n\n  return (\n    <CameraScope>\n      <CameraContext.Provider value={cameraCtx}>\n        <CameraInput hostRef={host} camera={camera} frame={DEFAULT_FRAME} />\n        <div\n          ref={(el) => {\n            host.current = el;\n            if (hostRef) hostRef.current = el;\n          }}\n          className=\"lk-stage\"\n        >\n          <div className=\"lk-stage__content\" style={cameraVars}>\n            {children}\n          </div>\n          <LinkedCursor />\n          {overlay}\n        </div>\n      </CameraContext.Provider>\n    </CameraScope>\n  );\n}\n"]}

package/dist/chunk-DWMSB4CA.js

@@ -0,0 +1,228 @@
+import { DEFAULT_FRAME } from './chunk-24W5VEJW.js';
+import { createContext, useContext, useRef, useMemo, useEffect } from 'react';
+import { normalizeZoom, usePointerContext, DepRegistryProvider, ActionsProvider, ActiveToolContextProvider, PointerContextProvider, useActionsRegistry, useDepSource, makeViewportZoomAction, viewportDragPanAction, useGestureDispatcher } from '@weasel-js/core';
+import { jsx, Fragment } from 'react/jsx-runtime';
+
+var CameraWheelContext = createContext(null);
+var DEFAULT_VIEW = { zoom: 1, pan: { x: 0, y: 0 } };
+function as2DView(view) {
+  if (typeof view !== "object" || view === null) return null;
+  const v = view;
+  if (typeof v.zoom !== "number") return null;
+  if (typeof v.pan !== "object" || v.pan === null) return null;
+  if (typeof v.pan.x !== "number" || typeof v.pan.y !== "number") return null;
+  return normalize2DView({ zoom: v.zoom, pan: { x: v.pan.x, y: v.pan.y } });
+}
+function normalize2DView(view) {
+  const zoom = normalizeZoom(view.zoom);
+  const x = Number.isFinite(view.pan.x) ? view.pan.x : 0;
+  const y = Number.isFinite(view.pan.y) ? view.pan.y : 0;
+  if (zoom === view.zoom && x === view.pan.x && y === view.pan.y) return view;
+  return { zoom, pan: { x, y } };
+}
+function withZoom(view, zoom) {
+  return normalize2DView({ zoom, pan: view.pan });
+}
+
+// src/canvas/cameraView.ts
+function toCameraView(view, frame = DEFAULT_FRAME) {
+  const v = normalize2DView(view);
+  return {
+    x: -(frame.originPx.x + v.pan.x) / v.zoom,
+    y: -(frame.originPx.y + v.pan.y) / v.zoom,
+    scale: { x: v.zoom, y: v.zoom }
+  };
+}
+function fromCameraView(view, frame = DEFAULT_FRAME) {
+  const zoom = view.scale.x;
+  return {
+    zoom,
+    pan: { x: -view.x * zoom - frame.originPx.x, y: -view.y * zoom - frame.originPx.y }
+  };
+}
+function frameLocalToWorld(p, frame = DEFAULT_FRAME) {
+  return { x: p.x, y: p.y * frame.yDir };
+}
+function clampZoomAbout(prev, next, min, max) {
+  const s0 = prev.scale.x;
+  const s1 = next.scale.x;
+  const clamped = Math.min(max, Math.max(min, s1));
+  if (clamped === s1) return next;
+  if (s0 === s1) return { ...next, scale: { x: clamped, y: clamped } };
+  const inv = 1 / s0 - 1 / s1;
+  const px = (next.x - prev.x) / inv;
+  const py = (next.y - prev.y) / inv;
+  return {
+    x: prev.x + px / s0 - px / clamped,
+    y: prev.y + py / s0 - py / clamped,
+    scale: { x: clamped, y: clamped }
+  };
+}
+var STAGE_VIEW_ID = "stage";
+var CameraContext = createContext(null);
+var CameraScopeContext = createContext(false);
+function CameraScope({ children }) {
+  const inScope = useContext(CameraScopeContext);
+  const pointer = usePointerContext();
+  if (inScope) return /* @__PURE__ */ jsx(Fragment, { children });
+  const scoped = /* @__PURE__ */ jsx(CameraScopeContext.Provider, { value: true, children });
+  return /* @__PURE__ */ jsx(DepRegistryProvider, { children: /* @__PURE__ */ jsx(ActionsProvider, { children: /* @__PURE__ */ jsx(ActiveToolContextProvider, { children: pointer ? scoped : /* @__PURE__ */ jsx(PointerContextProvider, { children: scoped }) }) }) });
+}
+function isPositiveFinite(n) {
+  return Number.isFinite(n) && n > 0;
+}
+function useCameraView({
+  view,
+  onViewChange,
+  frame,
+  hostRef,
+  minZoom = 0.1,
+  maxZoom = 32
+}) {
+  const live = useRef({ view: normalize2DView(view), onViewChange, frame });
+  live.current = { view: normalize2DView(view), onViewChange, frame };
+  const initialZoom = useRef(isPositiveFinite(view.zoom) ? view.zoom : null);
+  const bounds = useRef({ min: minZoom, max: maxZoom });
+  const opening = initialZoom.current;
+  bounds.current = {
+    min: opening == null ? minZoom : Math.min(minZoom, opening),
+    max: opening == null ? maxZoom : Math.max(maxZoom, opening)
+  };
+  return useMemo(() => {
+    const get = () => toCameraView(live.current.view, live.current.frame);
+    return {
+      get,
+      set: (next) => {
+        const { min, max } = bounds.current;
+        const clamped = clampZoomAbout(get(), next, min, max);
+        const vt = fromCameraView(clamped, live.current.frame);
+        live.current.view = vt;
+        live.current.onViewChange(vt);
+      },
+      hostSize: () => {
+        const r = hostRef.current?.getBoundingClientRect();
+        return r ? { width: r.width, height: r.height } : null;
+      }
+    };
+  }, [hostRef]);
+}
+var TAP_ID = "camera.tap";
+var NO_TOOLS = /* @__PURE__ */ new Map();
+var CHANNELS = { contextMenu: false, ingest: false };
+function CameraInput(props) {
+  const registry = useActionsRegistry();
+  if (!registry) return null;
+  return /* @__PURE__ */ jsx(CameraDispatch, { ...props, registry });
+}
+function CameraDispatch({
+  hostRef,
+  camera,
+  frame,
+  onTap,
+  registry
+}) {
+  const frameRef = useRef(frame);
+  frameRef.current = frame;
+  const onTapRef = useRef(onTap);
+  onTapRef.current = onTap;
+  useDepSource("view", () => camera);
+  useDepSource("rootView", () => camera);
+  const actions = useMemo(() => {
+    const zoom = makeViewportZoomAction({
+      wheel: "plain",
+      min: 1e-9,
+      max: Number.POSITIVE_INFINITY
+    });
+    const wheelOnly = zoom.defaultBinding.filter(
+      (b) => b.spec.kind === "wheel" || b.spec.kind === "pinch"
+    );
+    const tap = {
+      id: TAP_ID,
+      label: "Tap the canvas",
+      defaultBinding: { kind: "click" },
+      invoker: {
+        timing: "immediate",
+        run: (_deps, params) => {
+          const p = params;
+          if (p?.worldX === void 0 || p.worldY === void 0) return;
+          onTapRef.current?.(frameLocalToWorld({ x: p.worldX, y: p.worldY }, frameRef.current));
+        }
+      }
+    };
+    return [
+      viewportDragPanAction,
+      { ...zoom, defaultBinding: wheelOnly },
+      tap
+    ];
+  }, []);
+  useEffect(() => {
+    const offs = actions.map((a) => registry.register(a));
+    return () => {
+      for (const off of offs) off();
+    };
+  }, [registry, actions]);
+  const clientToWorld = useMemo(
+    () => (cx, cy) => {
+      const r = hostRef.current?.getBoundingClientRect();
+      const v = camera.get();
+      return {
+        x: (cx - (r?.left ?? 0)) / v.scale.x + v.x,
+        y: (cy - (r?.top ?? 0)) / v.scale.y + v.y
+      };
+    },
+    [hostRef, camera]
+  );
+  useGestureDispatcher({
+    canvasRef: hostRef,
+    actions: registry,
+    toolsById: NO_TOOLS,
+    clientToWorld,
+    channels: CHANNELS
+  });
+  usePublishPointer(hostRef, clientToWorld, frame, STAGE_VIEW_ID);
+  const wheelSlot = useContext(CameraWheelContext);
+  useEffect(() => {
+    if (!wheelSlot) return;
+    const forward = (e) => {
+      hostRef.current?.dispatchEvent(new WheelEvent("wheel", e));
+    };
+    wheelSlot.current = forward;
+    return () => {
+      if (wheelSlot.current === forward) wheelSlot.current = null;
+    };
+  }, [wheelSlot, hostRef]);
+  return null;
+}
+function usePublishPointer(hostRef, clientToLocal, frame, viewId) {
+  const store = usePointerContext();
+  const frameRef = useRef(frame);
+  frameRef.current = frame;
+  const toLocal = useRef(clientToLocal);
+  toLocal.current = clientToLocal;
+  useEffect(() => {
+    const el = hostRef.current;
+    if (!el || !store) return;
+    const onMove = (e) => {
+      const w = frameLocalToWorld(toLocal.current(e.clientX, e.clientY), frameRef.current);
+      store.set({ worldX: w.x, worldY: w.y, viewId });
+    };
+    const onLeave = (e) => {
+      if (e.buttons !== 0) return;
+      if (store.get()?.viewId === viewId) store.set(null);
+    };
+    el.addEventListener("pointermove", onMove);
+    el.addEventListener("pointerleave", onLeave);
+    return () => {
+      el.removeEventListener("pointermove", onMove);
+      el.removeEventListener("pointerleave", onLeave);
+    };
+  }, [hostRef, store, viewId]);
+}
+function pointerElsewhere(p, viewId, frame) {
+  if (!p || p.viewId === viewId) return null;
+  return frameLocalToWorld({ x: p.worldX, y: p.worldY }, frame);
+}
+
+export { CameraContext, CameraInput, CameraScope, CameraScopeContext, CameraWheelContext, DEFAULT_VIEW, STAGE_VIEW_ID, as2DView, clampZoomAbout, frameLocalToWorld, fromCameraView, normalize2DView, pointerElsewhere, toCameraView, useCameraView, usePublishPointer, withZoom };
+//# sourceMappingURL=chunk-DWMSB4CA.js.map
+//# sourceMappingURL=chunk-DWMSB4CA.js.map

package/dist/chunk-DWMSB4CA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/canvas/CameraWheelContext.ts","../src/state/view.ts","../src/canvas/cameraView.ts","../src/canvas/CameraInput.tsx"],"names":["createContext"],"mappings":"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","file":"chunk-DWMSB4CA.js","sourcesContent":["import { createContext } from 'react';\n\n/** Where a trial's camera takes a wheel event from outside its own element. */\nexport type CameraWheelSlot = { current: ((e: WheelEvent) => void) | null };\n\n/**\n * The trial's camera, for input that lands outside it. An annotation target's\n * input box is portalled into the surface container, so a wheel over a mark\n * never bubbles through the stage or canvas stack it sits on; the box hands\n * the event here instead.\n */\nexport const CameraWheelContext = createContext<CameraWheelSlot | null>(null);\n","import { normalizeZoom } from '@weasel-js/core';\nimport type { ViewTransform } from '../instrument/types';\n\n/** The 2D view labkit has always shipped, and what a trial gets when it names no\n *  other. Re-exported under its own name so a consumer can say which it means. */\nexport type ViewTransform2D = ViewTransform;\n\nexport const DEFAULT_VIEW: ViewTransform2D = { zoom: 1, pan: { x: 0, y: 0 } };\n\n/** A trial's view is opaque to labkit, so anything that needs the 2D shape — the\n *  zoom chrome, `CanvasStack` — asks for it and handles not getting it. */\nexport function as2DView(view: unknown): ViewTransform2D | null {\n  if (typeof view !== 'object' || view === null) return null;\n  const v = view as Partial<ViewTransform2D>;\n  if (typeof v.zoom !== 'number') return null;\n  if (typeof v.pan !== 'object' || v.pan === null) return null;\n  if (typeof v.pan.x !== 'number' || typeof v.pan.y !== 'number') return null;\n  return normalize2DView({ zoom: v.zoom, pan: { x: v.pan.x, y: v.pan.y } });\n}\n\n/** `view` inside the invariant every view holds: a zoom that is not a finite\n *  number of at least `ZOOM_FLOOR` becomes the floor, and a non-finite pan\n *  becomes 0. Returns `view` itself when it already holds. */\nexport function normalize2DView(view: ViewTransform2D): ViewTransform2D {\n  const zoom = normalizeZoom(view.zoom);\n  const x = Number.isFinite(view.pan.x) ? view.pan.x : 0;\n  const y = Number.isFinite(view.pan.y) ? view.pan.y : 0;\n  if (zoom === view.zoom && x === view.pan.x && y === view.pan.y) return view;\n  return { zoom, pan: { x, y } };\n}\n\n/** `view` at a new zoom, through the same rule. */\nexport function withZoom(view: ViewTransform2D, zoom: number): ViewTransform2D {\n  return normalize2DView({ zoom, pan: view.pan });\n}\n","/**\n * labkit's camera as a weasel `View`, so core's viewport actions drive it.\n *\n * labkit places a world point on screen at\n * `originPx + pan + zoom * (x, yDir * y)`. A weasel `View` places one at\n * `(p - (x, y)) * scale`. Over *frame-local* coordinates — the world with `y`\n * multiplied by `yDir` — the two are the same affine map, which is all a pan\n * or a zoom about a screen point needs.\n */\nimport type { View } from '@weasel-js/core';\nimport type { Point, ViewTransform } from '../instrument/types';\nimport { normalize2DView } from '../state/view';\nimport { DEFAULT_FRAME, type WorldFrame } from './worldSpec';\n\n/** The weasel `View` equal to `view` under `frame`. */\nexport function toCameraView(view: ViewTransform, frame: WorldFrame = DEFAULT_FRAME): View {\n  const v = normalize2DView(view);\n  return {\n    x: -(frame.originPx.x + v.pan.x) / v.zoom,\n    y: -(frame.originPx.y + v.pan.y) / v.zoom,\n    scale: { x: v.zoom, y: v.zoom },\n  };\n}\n\n/** The labkit camera equal to weasel `view` under `frame`. */\nexport function fromCameraView(view: View, frame: WorldFrame = DEFAULT_FRAME): ViewTransform {\n  const zoom = view.scale.x;\n  return {\n    zoom,\n    pan: { x: -view.x * zoom - frame.originPx.x, y: -view.y * zoom - frame.originPx.y },\n  };\n}\n\n/** A frame-local point in the instrument's world, and back — the map is its\n *  own inverse. */\nexport function frameLocalToWorld(p: Point, frame: WorldFrame = DEFAULT_FRAME): Point {\n  return { x: p.x, y: p.y * frame.yDir };\n}\n\n/**\n * `next` with its zoom held to [`min`, `max`], about the screen point the step\n * from `prev` was anchored on, so a zoom that hits a bound stays anchored where\n * the pointer is. A pan (equal scales) passes through.\n */\nexport function clampZoomAbout(prev: View, next: View, min: number, max: number): View {\n  const s0 = prev.scale.x;\n  const s1 = next.scale.x;\n  const clamped = Math.min(max, Math.max(min, s1));\n  if (clamped === s1) return next;\n  if (s0 === s1) return { ...next, scale: { x: clamped, y: clamped } };\n  // The screen point both views agree on: p / s0 + x0 = p / s1 + x1.\n  const inv = 1 / s0 - 1 / s1;\n  const px = (next.x - prev.x) / inv;\n  const py = (next.y - prev.y) / inv;\n  // The same point under the clamped scale.\n  return {\n    x: prev.x + px / s0 - px / clamped,\n    y: prev.y + py / s0 - py / clamped,\n    scale: { x: clamped, y: clamped },\n  };\n}\n","/**\n * A labkit camera driven by weasel's dispatcher: drag pans, the wheel zooms\n * about the pointer, a tap reports the world point, and the pointer is\n * published into the store in scope. What `usePanZoom` used to hand-roll.\n */\nimport {\n  type Action,\n  ActionsProvider,\n  type ActionsRegistry,\n  ActiveToolContextProvider,\n  DepRegistryProvider,\n  makeViewportZoomAction,\n  PointerContextProvider,\n  type PointerWorldPos,\n  type Tool,\n  useActionsRegistry,\n  useDepSource,\n  useGestureDispatcher,\n  usePointerContext,\n  type View,\n  type ViewApi,\n  viewportDragPanAction,\n} from '@weasel-js/core';\nimport {\n  createContext,\n  type ReactNode,\n  type RefObject,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport type { Point, ViewTransform } from '../instrument/types';\nimport { normalize2DView } from '../state/view';\nimport { CameraWheelContext } from './CameraWheelContext';\nimport { clampZoomAbout, frameLocalToWorld, fromCameraView, toCameraView } from './cameraView';\nimport type { ViewportSize, WorldFrame } from './worldSpec';\n\n/** The view id the stage publishes its pointer under. */\nexport const STAGE_VIEW_ID = 'stage';\n\n/**\n * A camera, as the things that sit beside it read it: an overview, a loupe, a\n * linked cursor. Points are *frame-local* — the world with `y` multiplied by\n * `frame.yDir` — which is the space `view` works in.\n */\nexport interface CameraContextValue {\n  /** The camera as a weasel `ViewApi`, clamped to its zoom range. */\n  view: ViewApi;\n  frame: WorldFrame;\n  /** The element the camera's dispatcher listens on. */\n  element: () => HTMLElement | null;\n  /** The content's own rect, frame-local, when it has one — a `<Stage>`'s. */\n  content?: { x: number; y: number; width: number; height: number };\n}\n\n/** The camera around the caller, or `null` outside one. */\nexport const CameraContext = createContext<CameraContextValue | null>(null);\n\n/** Set by a host that already provides one input scope for everything inside\n *  it — a trial — so the camera, the loupe and an overview share it. */\nexport const CameraScopeContext = createContext(false);\n\n/**\n * The actions and deps a camera routes through: the ones a trial provides, or\n * an isolated set of its own. Isolated, because an actions registry holds one\n * dispatcher, and a camera must not take input from a canvas beside it. The\n * pointer store is the exception — one already in scope is kept, since sharing\n * it is the point.\n */\nexport function CameraScope({ children }: { children: ReactNode }) {\n  const inScope = useContext(CameraScopeContext);\n  const pointer = usePointerContext();\n  if (inScope) return <>{children}</>;\n  const scoped = <CameraScopeContext.Provider value={true}>{children}</CameraScopeContext.Provider>;\n  return (\n    <DepRegistryProvider>\n      <ActionsProvider>\n        <ActiveToolContextProvider>\n          {pointer ? scoped : <PointerContextProvider>{scoped}</PointerContextProvider>}\n        </ActiveToolContextProvider>\n      </ActionsProvider>\n    </DepRegistryProvider>\n  );\n}\n\n/** Options for {@link useCameraView}. */\nexport interface CameraViewOptions {\n  view: ViewTransform;\n  onViewChange: (v: ViewTransform) => void;\n  frame: WorldFrame;\n  hostRef: RefObject<HTMLElement | null>;\n  minZoom?: number;\n  maxZoom?: number;\n}\n\nfunction isPositiveFinite(n: number): boolean {\n  return Number.isFinite(n) && n > 0;\n}\n\n/**\n * A labkit camera as a stable `ViewApi`. Its zoom range is widened to keep the\n * opening zoom reachable — captured once, so a zoom-out cannot shrink the\n * range and strand the opening view behind it.\n */\nexport function useCameraView({\n  view,\n  onViewChange,\n  frame,\n  hostRef,\n  minZoom = 0.1,\n  maxZoom = 32,\n}: CameraViewOptions): ViewApi {\n  const live = useRef({ view: normalize2DView(view), onViewChange, frame });\n  live.current = { view: normalize2DView(view), onViewChange, frame };\n  const initialZoom = useRef(isPositiveFinite(view.zoom) ? view.zoom : null);\n  const bounds = useRef({ min: minZoom, max: maxZoom });\n  const opening = initialZoom.current;\n  bounds.current = {\n    min: opening == null ? minZoom : Math.min(minZoom, opening),\n    max: opening == null ? maxZoom : Math.max(maxZoom, opening),\n  };\n\n  return useMemo<ViewApi>(() => {\n    const get = (): View => toCameraView(live.current.view, live.current.frame);\n    return {\n      get,\n      set: (next: View) => {\n        const { min, max } = bounds.current;\n        const clamped = clampZoomAbout(get(), next, min, max);\n        const vt = fromCameraView(clamped, live.current.frame);\n        // Written ahead of the render, so a second event inside one commit\n        // steps from this one.\n        live.current.view = vt;\n        live.current.onViewChange(vt);\n      },\n      hostSize: () => {\n        const r = hostRef.current?.getBoundingClientRect();\n        return r ? { width: r.width, height: r.height } : null;\n      },\n    };\n  }, [hostRef]);\n}\n\nconst TAP_ID = 'camera.tap';\nconst NO_TOOLS: ReadonlyMap<string, Tool> = new Map();\nconst CHANNELS = { contextMenu: false, ingest: false } as const;\n\n/** Props for `<CameraInput>`. */\nexport interface CameraInputProps {\n  hostRef: RefObject<HTMLElement | null>;\n  camera: ViewApi;\n  frame: WorldFrame;\n  /** A primary-button press released without crossing the drag threshold, at\n   *  the world point it landed on. */\n  onTap?: (world: Point) => void;\n}\n\n/**\n * Mounts the dispatcher on `hostRef` and routes the camera's gestures through\n * it. Render it inside a `<CameraScope>`; with no actions registry in scope it\n * renders nothing.\n */\nexport function CameraInput(props: CameraInputProps) {\n  const registry = useActionsRegistry();\n  if (!registry) return null;\n  return <CameraDispatch {...props} registry={registry} />;\n}\n\nfunction CameraDispatch({\n  hostRef,\n  camera,\n  frame,\n  onTap,\n  registry,\n}: CameraInputProps & { registry: ActionsRegistry }) {\n  const frameRef = useRef(frame);\n  frameRef.current = frame;\n  const onTapRef = useRef(onTap);\n  onTapRef.current = onTap;\n\n  useDepSource('view', () => camera);\n  useDepSource('rootView', () => camera);\n\n  const actions = useMemo<Action[]>(() => {\n    // Unclamped here: `camera.set` clamps, to a range widened around the\n    // opening zoom, and anchors the clamp where the wheel was.\n    const zoom = makeViewportZoomAction({\n      wheel: 'plain',\n      min: 1e-9,\n      max: Number.POSITIVE_INFINITY,\n    });\n    // The wheel and the trackpad's two pinch forms only: the zoom keys listen\n    // on the window, and every trial on a page would take them at once.\n    const wheelOnly = (zoom.defaultBinding as { spec: { kind: string } }[]).filter(\n      (b) => b.spec.kind === 'wheel' || b.spec.kind === 'pinch',\n    );\n    const tap: Action = {\n      id: TAP_ID,\n      label: 'Tap the canvas',\n      defaultBinding: { kind: 'click' },\n      invoker: {\n        timing: 'immediate',\n        run: (_deps, params) => {\n          const p = params as { worldX?: number; worldY?: number } | undefined;\n          if (p?.worldX === undefined || p.worldY === undefined) return;\n          onTapRef.current?.(frameLocalToWorld({ x: p.worldX, y: p.worldY }, frameRef.current));\n        },\n      },\n    };\n    return [\n      viewportDragPanAction,\n      { ...zoom, defaultBinding: wheelOnly as Action['defaultBinding'] },\n      tap,\n    ];\n  }, []);\n\n  useEffect(() => {\n    const offs = actions.map((a) => registry.register(a));\n    return () => {\n      for (const off of offs) off();\n    };\n  }, [registry, actions]);\n\n  const clientToWorld = useMemo(\n    () => (cx: number, cy: number) => {\n      const r = hostRef.current?.getBoundingClientRect();\n      const v = camera.get();\n      return {\n        x: (cx - (r?.left ?? 0)) / v.scale.x + v.x,\n        y: (cy - (r?.top ?? 0)) / v.scale.y + v.y,\n      };\n    },\n    [hostRef, camera],\n  );\n\n  useGestureDispatcher({\n    canvasRef: hostRef,\n    actions: registry,\n    toolsById: NO_TOOLS,\n    clientToWorld,\n    channels: CHANNELS,\n  });\n\n  usePublishPointer(hostRef, clientToWorld, frame, STAGE_VIEW_ID);\n\n  // Input that lands outside the camera's element — an annotation target's\n  // box, portalled into the surface — reaches the dispatcher through here.\n  const wheelSlot = useContext(CameraWheelContext);\n  useEffect(() => {\n    if (!wheelSlot) return;\n    const forward = (e: WheelEvent): void => {\n      hostRef.current?.dispatchEvent(new WheelEvent('wheel', e));\n    };\n    wheelSlot.current = forward;\n    return () => {\n      if (wheelSlot.current === forward) wheelSlot.current = null;\n    };\n  }, [wheelSlot, hostRef]);\n\n  return null;\n}\n\n/**\n * Publish the pointer over `hostRef` into the store in scope, in the\n * instrument's world, as `viewId`; clear it when the pointer leaves with no\n * button held.\n */\nexport function usePublishPointer(\n  hostRef: RefObject<HTMLElement | null>,\n  clientToLocal: (cx: number, cy: number) => Point,\n  frame: WorldFrame,\n  viewId: string,\n): void {\n  const store = usePointerContext();\n  const frameRef = useRef(frame);\n  frameRef.current = frame;\n  const toLocal = useRef(clientToLocal);\n  toLocal.current = clientToLocal;\n  useEffect(() => {\n    const el = hostRef.current;\n    if (!el || !store) return;\n    const onMove = (e: PointerEvent): void => {\n      const w = frameLocalToWorld(toLocal.current(e.clientX, e.clientY), frameRef.current);\n      store.set({ worldX: w.x, worldY: w.y, viewId });\n    };\n    const onLeave = (e: PointerEvent): void => {\n      if (e.buttons !== 0) return;\n      if (store.get()?.viewId === viewId) store.set(null);\n    };\n    el.addEventListener('pointermove', onMove);\n    el.addEventListener('pointerleave', onLeave);\n    return () => {\n      el.removeEventListener('pointermove', onMove);\n      el.removeEventListener('pointerleave', onLeave);\n    };\n  }, [hostRef, store, viewId]);\n}\n\n/** The pointer as a frame-local point, or `null` when there is none or it is\n *  over `viewId` itself. */\nexport function pointerElsewhere(\n  p: PointerWorldPos,\n  viewId: string,\n  frame: WorldFrame,\n): Point | null {\n  if (!p || p.viewId === viewId) return null;\n  return frameLocalToWorld({ x: p.worldX, y: p.worldY }, frame);\n}\n\nexport type { ViewportSize };\n"]}