@weasel-js/labkit 1.7.0 → 1.7.1

package/dist/chunk-IJJUK4FU.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/surface/composeRects.ts","../src/surface/deviceRect.ts","../src/surface/useTiledSurface.ts"],"names":[],"mappings":"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","file":"chunk-IJJUK4FU.js","sourcesContent":["import type { Box, Rect } from './rect';\n\n/** Every tile's box expressed against the container's origin. */\nexport function composeRects(container: Box, tiles: ReadonlyMap<string, Box>): Map<string, Rect> {\n  const out = new Map<string, Rect>();\n  for (const [id, tile] of tiles) {\n    out.set(id, {\n      x: tile.left - container.left,\n      y: tile.top - container.top,\n      w: tile.width,\n      h: tile.height,\n    });\n  }\n  return out;\n}\n\nexport function rectsEqual(a: Rect | undefined, b: Rect): boolean {\n  return a !== undefined && a.x === b.x && a.y === b.y && a.w === b.w && a.h === b.h;\n}\n","import type { Rect } from './rect';\n\n/**\n * A DOM rect as a GL viewport rect: origin at the bottom-left, every edge snapped\n * to the device-pixel grid. Still CSS pixels, because three.js applies its own\n * pixel ratio — snapping here is what stops a tile and its neighbour rounding\n * apart and leaving a hairline column between them.\n */\nexport function toDeviceRect(rect: Rect, surfaceHeight: number, dpr: number): Rect {\n  const snap = (v: number) => Math.round(v * dpr) / dpr;\n  const x = snap(rect.x);\n  const y = snap(surfaceHeight - rect.y - rect.h);\n  return {\n    x,\n    y,\n    w: snap(rect.x + rect.w) - x,\n    h: snap(surfaceHeight - rect.y) - y,\n  };\n}\n","import { useVisibleRaf } from '@weasel-js/core';\nimport { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { composeRects, rectsEqual } from './composeRects';\nimport type { Box, Rect } from './rect';\n\n/** What a surface owner is handed once per animation frame. `rects` carries every\n *  tile, not only the dirty ones: a scissored draw has to know where it is drawing\n *  relative to a surface that may have resized under it.\n *\n *  Its keys are what `useTileId` returns — `<trial>/<id>` for a tile registered\n *  inside a trial — not the bare id the tile was named with. */\nexport interface SurfaceFrame {\n  dirty: ReadonlySet<string>;\n  rects: ReadonlyMap<string, Rect>;\n  dpr: number;\n  size: { width: number; height: number };\n  /** The tile geometry changed this frame — a tile moved, resized, appeared or\n   *  went away, or the dpr did. Every tile is dirty on such a frame, but the\n   *  pixels a tile vacated are in no tile's scissor now, so the owner clears\n   *  the whole buffer. `<Lab>` does; a host owning its own surface must too. */\n  retiled: boolean;\n}\n\n/** The invalidators and the two ref callbacks that publish geometry. */\nexport interface SurfaceHandle {\n  /** Mark one tile for redraw. */\n  invalidate: (id: string) => void;\n  /** Mark every tile — what a resize or a tile-set change means. */\n  invalidateAll: () => void;\n  /** Re-measure before the next frame. The escape hatch for a host that knows it\n   *  moved something a ResizeObserver cannot see. */\n  invalidateRects: () => void;\n  registerTile: (id: string, el: HTMLElement | null) => void;\n  /** Register a tenant's whole-buffer clear. Every one registered runs, before\n   *  any painter, on a frame where the tile geometry changed — the pixels a\n   *  tile vacated are in no scissor now, and only the context that drew them\n   *  can erase them. Backend-agnostic by necessity: labkit owns the canvas,\n   *  never the context. */\n  registerClear: (id: string, clear: SurfaceClear) => () => void;\n  /** Subscribe a tile to the frames it is dirty on. A tile paints on its own\n   *  loop, so this is how the surface wakes one: a resize of the shared buffer\n   *  clears every tile, not only the one that moved. */\n  registerPainter: (id: string, paint: TilePainter) => () => void;\n  containerRef: (el: HTMLElement | null) => void;\n  /** The element tile rects are measured against, and so the one a tile's own\n   *  chrome positions itself inside. Null before the owner attaches it. */\n  getContainer: () => HTMLElement | null;\n}\n\n/** What a tile's painter is handed: where it sits on the surface now, and the\n *  frame that dirtied it. */\nexport type TilePainter = (rect: Rect, frame: SurfaceFrame) => void;\n\n/** Erase the whole shared buffer. Device pixels, because that is what a GL\n *  viewport takes. */\nexport type SurfaceClear = (size: { width: number; height: number }, dpr: number) => void;\n\nexport interface UseTiledSurfaceOptions {\n  onFrame: (frame: SurfaceFrame) => void;\n}\n\nexport function useTiledSurface({ onFrame }: UseTiledSurfaceOptions): SurfaceHandle {\n  const container = useRef<HTMLElement | null>(null);\n  const tiles = useRef(new Map<string, HTMLElement>());\n  const rects = useRef(new Map<string, Rect>());\n  const dirty = useRef(new Set<string>());\n  const painters = useRef(new Map<string, TilePainter>());\n  const clears = useRef(new Map<string, SurfaceClear>());\n  const needsMeasure = useRef(true);\n  const observer = useRef<ResizeObserver | null>(null);\n  const lastDpr = useRef(0);\n\n  // Held in a ref so a caller passing an inline closure does not re-create every\n  // callback below on each render.\n  const onFrameRef = useRef(onFrame);\n  onFrameRef.current = onFrame;\n\n  const measure = useCallback((): boolean => {\n    const el = container.current;\n    if (!el) return false;\n    const boxes = new Map<string, Box>();\n    for (const [id, tile] of tiles.current) boxes.set(id, tile.getBoundingClientRect());\n    const next = composeRects(el.getBoundingClientRect(), boxes);\n    let changed = next.size !== rects.current.size;\n    for (const [id, rect] of next) {\n      if (!rectsEqual(rects.current.get(id), rect)) changed = true;\n    }\n    rects.current = next;\n    return changed;\n  }, []);\n\n  const frameLoop = useVisibleRaf(\n    () => {\n      const el = container.current;\n      if (!el) {\n        dirty.current.clear();\n        return;\n      }\n      let retiled = false;\n      if (needsMeasure.current) {\n        needsMeasure.current = false;\n        if (measure()) {\n          retiled = true;\n          for (const id of rects.current.keys()) dirty.current.add(id);\n          // Geometry that changed may still be moving: a panel whose size has\n          // settled while its position animates gives `ResizeObserver` nothing\n          // more to report, and the tile would hold the frame it was caught\n          // mid-flight at. Measure again next frame, and keep going until a\n          // measurement finds nothing moved.\n          needsMeasure.current = true;\n          schedule();\n        }\n      }\n      const dpr = globalThis.devicePixelRatio ?? 1;\n      if (dpr !== lastDpr.current) {\n        lastDpr.current = dpr;\n        retiled = true;\n        for (const id of rects.current.keys()) dirty.current.add(id);\n      }\n      if (dirty.current.size === 0) return;\n      const box = el.getBoundingClientRect();\n      const frame: SurfaceFrame = {\n        dirty: new Set(dirty.current),\n        rects: new Map(rects.current),\n        dpr,\n        size: { width: box.width, height: box.height },\n        retiled,\n      };\n      // Cleared before the owner runs, not after the painters: sizing the\n      // buffer blanks every tile, so the owner answers with `invalidateAll`,\n      // and a set cleared at the end of the frame would swallow it.\n      dirty.current.clear();\n      onFrameRef.current(frame);\n      // After the owner sized the buffer, before anything paints into it.\n      if (retiled) {\n        for (const clear of clears.current.values()) clear(frame.size, dpr);\n      }\n      // After the owner, which is what resized the buffer this frame — and\n      // whatever it just dirtied paints now rather than a frame later.\n      const painting = new Set(frame.dirty);\n      for (const id of dirty.current) painting.add(id);\n      dirty.current.clear();\n      const paintFrame: SurfaceFrame = { ...frame, dirty: painting };\n      for (const id of painting) {\n        const rect = frame.rects.get(id);\n        if (rect) painters.current.get(id)?.(rect, paintFrame);\n      }\n    },\n    // The host attaches its container through `containerRef`, which may land\n    // well after this hook's first effect; the gate re-resolves it per request.\n    { target: () => container.current },\n  );\n\n  const schedule = useCallback(() => {\n    frameLoop.request();\n  }, [frameLoop]);\n\n  const invalidate = useCallback(\n    (id: string) => {\n      dirty.current.add(id);\n      schedule();\n    },\n    [schedule],\n  );\n\n  const invalidateAll = useCallback(() => {\n    for (const id of tiles.current.keys()) dirty.current.add(id);\n    schedule();\n  }, [schedule]);\n\n  const invalidateRects = useCallback(() => {\n    needsMeasure.current = true;\n    schedule();\n  }, [schedule]);\n\n  const registerTile = useCallback(\n    (id: string, el: HTMLElement | null) => {\n      const known = tiles.current.get(id);\n      if (known === el) return;\n      if (known) observer.current?.unobserve(known);\n      if (el) {\n        tiles.current.set(id, el);\n        observer.current?.observe(el);\n      } else {\n        tiles.current.delete(id);\n        rects.current.delete(id);\n        dirty.current.delete(id);\n      }\n      needsMeasure.current = true;\n      schedule();\n    },\n    [schedule],\n  );\n\n  const registerClear = useCallback((id: string, clear: SurfaceClear) => {\n    clears.current.set(id, clear);\n    return () => {\n      if (clears.current.get(id) === clear) clears.current.delete(id);\n    };\n  }, []);\n\n  const registerPainter = useCallback((id: string, paint: TilePainter) => {\n    painters.current.set(id, paint);\n    return () => {\n      if (painters.current.get(id) === paint) painters.current.delete(id);\n    };\n  }, []);\n\n  const getContainer = useCallback(() => container.current, []);\n\n  const containerRef = useCallback(\n    (el: HTMLElement | null) => {\n      if (container.current === el) return;\n      if (container.current) observer.current?.unobserve(container.current);\n      container.current = el;\n      if (el) observer.current?.observe(el);\n      needsMeasure.current = true;\n      schedule();\n    },\n    [schedule],\n  );\n\n  useEffect(() => {\n    const ro = new ResizeObserver(() => {\n      needsMeasure.current = true;\n      schedule();\n    });\n    observer.current = ro;\n    if (container.current) ro.observe(container.current);\n    for (const el of tiles.current.values()) ro.observe(el);\n    return () => {\n      ro.disconnect();\n      observer.current = null;\n      frameLoop.cancel();\n    };\n  }, [schedule, frameLoop]);\n\n  return useMemo(\n    () => ({\n      invalidate,\n      invalidateAll,\n      invalidateRects,\n      registerTile,\n      registerClear,\n      registerPainter,\n      containerRef,\n      getContainer,\n    }),\n    [\n      invalidate,\n      invalidateAll,\n      invalidateRects,\n      registerTile,\n      registerClear,\n      registerPainter,\n      containerRef,\n      getContainer,\n    ],\n  );\n}\n"]}

package/dist/chunk-J7OWWTCW.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/primitives/FloatingPanel.tsx"],"names":[],"mappings":"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","file":"chunk-J7OWWTCW.js","sourcesContent":["import { openPointerSession, type PointerSession, pastDragThreshold } from '@weasel-js/core';\nimport type React from 'react';\nimport { type CSSProperties, type ReactNode, useEffect, useMemo, useRef, useState } from 'react';\nimport {\n  type Corner,\n  DEFAULT_ANCHOR,\n  DEFAULT_INSET,\n  FLOATING_DRAG_PREFIX,\n  type FloatingPlacement,\n  floatingStrategy,\n} from 'windease';\nimport { usePersistedState } from '../state/usePersistedState';\n\n/** The strategy holds a map keyed by item id; a panel is always a lone item. */\nconst ITEM_ID = 'panel';\n\n/** Props for `<FloatingPanel>`. */\nexport interface FloatingPanelProps {\n  children: ReactNode;\n  /** Corner it rests in before it has ever been dragged. Default `'bottom-left'`. */\n  anchor?: Corner;\n  /** Corners that may capture it. Default: all four. */\n  snapCorners?: readonly Corner[];\n  /** Pixels in from a corner when snapped. Default 12. */\n  inset?: number;\n  /** Name to remember its position under, through `usePersistedState` — so it\n   *  is remembered only inside a lab or a `<Persistence>`. Omit to forget on\n   *  reload. */\n  persist?: string;\n  className?: string;\n}\n\n/**\n * The panel's footprint is its border box — `contentRect` excludes padding and\n * border, which would place a panel that then overflows its corner by exactly\n * that much.\n */\nfunction borderBoxOf(entry: ResizeObserverEntry): { w: number; h: number } {\n  const box = entry.borderBoxSize?.[0];\n  if (box) return { w: box.inlineSize, h: box.blockSize };\n  return { w: entry.contentRect.width, h: entry.contentRect.height };\n}\n\n/** A pointerdown on one of these is the child's, not a drag. */\nfunction isInteractive(target: EventTarget | null): boolean {\n  if (!(target instanceof Element)) return false;\n  return target.closest('input, button, a, select, textarea, [data-no-drag]') !== null;\n}\n\n/**\n * A draggable box that floats over its offset parent and snaps to its corners.\n *\n * Drives windease's `floatingStrategy` as a pure function rather than mounting a\n * windease container: a lab overlay has one item and no zone tree, so the node\n * model would be all cost. Pointer handling is therefore this component's, and\n * windease's own affordance rendering never participates.\n */\nexport function FloatingPanel({\n  children,\n  anchor = DEFAULT_ANCHOR,\n  snapCorners,\n  inset = DEFAULT_INSET,\n  persist,\n  className,\n}: FloatingPanelProps) {\n  const ref = useRef<HTMLDivElement>(null);\n  const strategy = useMemo(() => floatingStrategy(), []);\n  const options = useMemo(() => ({ defaultAnchor: anchor, inset }), [anchor, inset]);\n\n  const [container, setContainer] = useState({ w: 0, h: 0 });\n  const [size, setSize] = useState({ w: 0, h: 0 });\n  const [place, setPlace] = usePersistedState<FloatingPlacement>(persist, () => ({\n    x: 0,\n    y: 0,\n    anchor,\n  }));\n\n  const item = useMemo(\n    () => ({\n      id: ITEM_ID,\n      meta: { floating: true, ...(snapCorners ? { snapCorners: [...snapCorners] } : {}) },\n      natural: size,\n    }),\n    [size, snapCorners],\n  );\n\n  useEffect(() => {\n    const el = ref.current;\n    const parent = el?.offsetParent ?? el?.parentElement;\n    if (!el || !parent) return;\n    // Sizes come off the entry, not the DOM: jsdom reports 0 for every\n    // clientWidth/offsetWidth, and an unmeasured item is withheld from layout.\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.target === parent) {\n          setContainer({ w: entry.contentRect.width, h: entry.contentRect.height });\n        } else {\n          setSize(borderBoxOf(entry));\n        }\n      }\n    });\n    observer.observe(parent);\n    observer.observe(el);\n    return () => observer.disconnect();\n  }, []);\n\n  const rect = strategy\n    .layout({\n      items: [item],\n      container,\n      state: { at: { [ITEM_ID]: place }, inner: undefined },\n      options,\n    })\n    .placements.get(ITEM_ID);\n\n  const dragging = useRef<{ x: number; y: number } | null>(null);\n  const session = useRef<PointerSession | null>(null);\n  const [isDragging, setDragging] = useState(false);\n  // A drag outlives the render that started it, so the reducer's inputs are\n  // read here and not from that render's closure — a container resized\n  // mid-drag would otherwise place the panel against its old box.\n  const layout = useRef({ container, options, item });\n  layout.current = { container, options, item };\n\n  useEffect(() => () => session.current?.cancel(), []);\n\n  const onPointerDown = (e: React.PointerEvent<HTMLDivElement>) => {\n    if (isInteractive(e.target)) return;\n    // The canvas stack underneath owns pan/zoom on the same pointer events.\n    e.stopPropagation();\n    const origin = e.currentTarget;\n    const pointerId = e.pointerId;\n    const start = { x: e.clientX, y: e.clientY };\n\n    const end = () => {\n      session.current = null;\n      if (!dragging.current) return;\n      dragging.current = null;\n      setDragging(false);\n      try {\n        origin.releasePointerCapture?.(pointerId);\n      } catch {\n        // Capture is already gone whenever the session ended by losing it.\n      }\n    };\n\n    // Armed, not capturing. Capture retargets mouseup to this element, and the\n    // browser then synthesizes no `click` on the child under the cursor — so\n    // capturing on press makes every non-native control in the panel dead to a\n    // real mouse, silently. `isInteractive` only exempts the names it lists; a\n    // `role=\"button\"` span, a react-aria control or a canvas is not among them.\n    session.current = openPointerSession(\n      origin,\n      e,\n      {\n        onMove: (ev) => {\n          if (!dragging.current) {\n            if (!pastDragThreshold({ clientX: start.x, clientY: start.y }, ev)) return;\n            dragging.current = { ...start };\n            setDragging(true);\n            origin.setPointerCapture?.(pointerId);\n          }\n          const from = dragging.current;\n          const dx = ev.clientX - from.x;\n          const dy = ev.clientY - from.y;\n          if (dx === 0 && dy === 0) return;\n          dragging.current = { x: ev.clientX, y: ev.clientY };\n          const { container: box, options: opts, item: only } = layout.current;\n          setPlace(\n            (prev) =>\n              strategy.reduce?.(\n                { at: { [ITEM_ID]: prev }, inner: undefined },\n                {\n                  affordanceId: `${FLOATING_DRAG_PREFIX}${ITEM_ID}`,\n                  kind: 'drag',\n                  payload: { dx, dy },\n                },\n                { container: box, options: opts, items: [only] },\n              ).at[ITEM_ID] ?? prev,\n          );\n        },\n        onEnd: end,\n        onCancel: end,\n      },\n      { capture: false },\n    );\n  };\n\n  return (\n    <div\n      className={className ? `lk-floating-panel ${className}` : 'lk-floating-panel'}\n      data-dragging={isDragging ? 'true' : undefined}\n      data-placed={rect ? 'true' : undefined}\n      onPointerDown={onPointerDown}\n      ref={ref}\n      style={\n        {\n          position: 'absolute',\n          left: `${rect?.x ?? 0}px`,\n          top: `${rect?.y ?? 0}px`,\n        } as CSSProperties\n      }\n    >\n      {children}\n    </div>\n  );\n}\n"]}

package/dist/chunk-M7HP3FTK.js

@@ -1,549 +0,0 @@
-import { centerOn, zoomAt } from './chunk-JVBYV6TL.js';
-import { screenToWorld } from './chunk-AWQG7FCC.js';
-import { CameraContext, CameraScope } from './chunk-UNAZSLWE.js';
-import { resolveFrame, DEFAULT_FRAME } from './chunk-24W5VEJW.js';
-import { CanvasStackContext } from './chunk-CQLQPQ4P.js';
-import { useVisibleRaf, useActionsRegistry, useGestureDispatcher, normalizeZoom } from '@weasel-js/core';
-import { useRef, useEffect, useContext, useReducer, useCallback, useMemo, useState } from 'react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-// src/loupe/canvasLens.ts
-function lensCamera(aim, outer, outerFrame, factor, diameter, worldSpec) {
-  const size = { width: diameter, height: diameter };
-  const frame = resolveFrame(worldSpec, size);
-  const world = screenToWorld(aim, outer, outerFrame);
-  return { view: centerOn(world, outer.zoom * factor, size, frame), frame };
-}
-function lensSourceRect(aim, factor, diameter, dpr) {
-  const span = diameter / factor;
-  return {
-    sx: (aim.x - span / 2) * dpr,
-    sy: (aim.y - span / 2) * dpr,
-    sw: span * dpr,
-    sh: span * dpr
-  };
-}
-function sampleStack(layers, canvases, p, dpr) {
-  for (let i = layers.length - 1; i >= 0; i--) {
-    const layer = layers[i];
-    if (!layer.visible) continue;
-    const canvas = canvases.get(layer.id);
-    if (!canvas) continue;
-    const ctx = canvas.getContext("2d", { willReadFrequently: true });
-    if (!ctx) continue;
-    const x = Math.floor(p.x * dpr);
-    const y = Math.floor(p.y * dpr);
-    if (x < 0 || y < 0 || x >= canvas.width || y >= canvas.height) continue;
-    const [r, g, b, a] = ctx.getImageData(x, y, 1, 1).data;
-    if (a === 0) continue;
-    return `#${[r, g, b].map((c) => c.toString(16).padStart(2, "0")).join("")}`;
-  }
-  return null;
-}
-function drawCanvasLens(ctx, opts) {
-  const { aim, factor, diameter, dpr, mode, outer, layers, canvases } = opts;
-  ctx.save();
-  ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
-  ctx.clearRect(0, 0, diameter, diameter);
-  if (mode === "pixel") {
-    const { sx, sy, sw, sh } = lensSourceRect(aim, factor, diameter, dpr);
-    ctx.imageSmoothingEnabled = false;
-    for (const layer of layers) {
-      if (!layer.visible) continue;
-      const canvas = canvases.get(layer.id);
-      if (!canvas || canvas.width === 0 || canvas.height === 0) continue;
-      ctx.drawImage(canvas, sx, sy, sw, sh, 0, 0, diameter, diameter);
-    }
-    ctx.restore();
-    return;
-  }
-  const lens = lensCamera(
-    aim,
-    outer,
-    opts.outerFrame ?? DEFAULT_FRAME,
-    factor,
-    diameter,
-    opts.worldSpec
-  );
-  for (const layer of layers) {
-    if (!layer.visible) continue;
-    ctx.save();
-    layer.render(ctx, lens.view, lens.frame);
-    ctx.restore();
-  }
-  ctx.restore();
-}
-function CanvasLoupe({
-  aim,
-  factor,
-  mode,
-  diameter,
-  surface,
-  view,
-  frame,
-  worldSpec
-}) {
-  const canvasRef = useRef(null);
-  const dpr = surface.size.dpr;
-  const args = { aim, factor, mode, diameter, dpr, view, frame, worldSpec, surface };
-  const argsRef = useRef(args);
-  argsRef.current = args;
-  const loop = useVisibleRaf(
-    () => {
-      loop.request();
-      const canvas = canvasRef.current;
-      const ctx = canvas?.getContext("2d");
-      const canvases = argsRef.current.surface.canvases.current;
-      if (!ctx || !canvases) return;
-      const a = argsRef.current;
-      drawCanvasLens(ctx, {
-        aim: a.aim,
-        factor: a.factor,
-        diameter: a.diameter,
-        dpr: a.dpr,
-        mode: a.mode,
-        outer: a.view,
-        outerFrame: a.frame,
-        worldSpec: a.worldSpec,
-        layers: a.surface.layers,
-        canvases
-      });
-    },
-    { target: canvasRef }
-  );
-  useEffect(() => {
-    loop.request();
-    return () => loop.cancel();
-  }, [loop]);
-  return /* @__PURE__ */ jsx(
-    "canvas",
-    {
-      ref: canvasRef,
-      className: "lk-loupe__canvas",
-      width: Math.max(1, Math.round(diameter * dpr)),
-      height: Math.max(1, Math.round(diameter * dpr))
-    }
-  );
-}
-function DomLoupe({
-  aim,
-  factor,
-  mode,
-  diameter,
-  size,
-  view,
-  frame,
-  state,
-  config,
-  render
-}) {
-  const style = {
-    width: `${size.width}px`,
-    height: `${size.height}px`,
-    transform: `translate(${diameter / 2 - aim.x}px, ${diameter / 2 - aim.y}px)`
-  };
-  return /* @__PURE__ */ jsx("div", { className: "lk-loupe__stage", style, children: render({
-    state,
-    config,
-    view: zoomAt(view, factor, aim, { frame }),
-    factor,
-    mode,
-    size
-  }) });
-}
-function LoupeBubble({ aim, diameter, hostRef, children }) {
-  const style = {
-    width: `${diameter}px`,
-    height: `${diameter}px`,
-    transform: `translate(${aim.x - diameter / 2}px, ${aim.y - diameter / 2}px)`
-  };
-  return /* @__PURE__ */ jsx("div", { ref: hostRef, className: "lk-loupe", style, "aria-hidden": "true", children });
-}
-
-// src/loupe/loupeActions.ts
-var LOUPE_PEEK_ID = "loupe.peek";
-var LOUPE_MAGNIFY_ID = "loupe.magnify";
-var WHEEL_RATE = 2e-3;
-function createLoupeActions(input, peekKey) {
-  const magnify = {
-    id: LOUPE_MAGNIFY_ID,
-    label: "Magnify (loupe)",
-    group: "loupe",
-    // Hotkey scope, so while the lens is up it outranks the trial camera's
-    // wheel zoom on the same dispatcher; while it is down `enabled` declines
-    // and the zoom runs.
-    scope: "hotkey",
-    // Every modifier optional: the lens claims the wheel whenever it is up,
-    // which is what the hand-rolled capture-phase listener did. A bare spec
-    // would forbid modifiers and hand Cmd+wheel back to the lab mid-peek.
-    defaultBinding: [
-      {
-        spec: {
-          kind: "wheel",
-          mods: { alt: "optional", ctrl: "optional", meta: "optional", shift: "optional" }
-        },
-        opts: {}
-      }
-    ],
-    enabled: () => input.shown() ? true : "not-applicable",
-    invoker: {
-      timing: "immediate",
-      run(_deps, params) {
-        input.magnifyBy(params?.deltaY ?? 0);
-      }
-    }
-  };
-  if (peekKey === null) return [magnify];
-  const peek = {
-    id: LOUPE_PEEK_ID,
-    label: "Peek (loupe)",
-    group: "loupe",
-    // Hotkey scope: peeking must beat whatever the lab's active tool binds to
-    // the same key, the way every other held-key trigger does.
-    scope: "hotkey",
-    // Every modifier optional because the peek key may BE one: the keydown
-    // that carries `Alt` — the default — also reports `altKey: true`, and the
-    // matcher forbids any modifier a spec does not name.
-    defaultBinding: [
-      {
-        spec: {
-          kind: "key-held",
-          key: peekKey,
-          mods: { alt: "optional", ctrl: "optional", meta: "optional", shift: "optional" }
-        },
-        opts: {}
-      }
-    ],
-    invoker: {
-      timing: "ongoing",
-      start() {
-        input.setPeeking(true);
-        return { onEnd: () => input.setPeeking(false) };
-      }
-    }
-  };
-  return [peek, magnify];
-}
-var NO_TOOLS = /* @__PURE__ */ new Map();
-var CHANNELS = { pointer: false, contextMenu: false, ingest: false };
-function LoupeDispatch({
-  hostRef,
-  input,
-  peekKey,
-  registry,
-  ownDispatcher
-}) {
-  const actions = useMemo(() => createLoupeActions(input, peekKey), [input, peekKey]);
-  useEffect(() => {
-    const offs = actions.map((a) => registry.register(a));
-    return () => {
-      for (const off of offs) off();
-    };
-  }, [registry, actions]);
-  useGestureDispatcher({
-    canvasRef: hostRef,
-    actions: registry,
-    entriesById: NO_TOOLS,
-    channels: CHANNELS,
-    enabled: ownDispatcher
-  });
-  return null;
-}
-function LoupeGestures(props) {
-  const registry = useActionsRegistry();
-  const camera = useContext(CameraContext);
-  if (!registry) return null;
-  return /* @__PURE__ */ jsx(LoupeDispatch, { ...props, registry, ownDispatcher: camera === null });
-}
-var ZERO = { width: 0, height: 0 };
-function useHostSize(ref) {
-  const [size, setSize] = useState(ZERO);
-  useEffect(() => {
-    const el = ref.current;
-    if (!el) return;
-    const update = () => {
-      const rect = el.getBoundingClientRect();
-      setSize(
-        (prev) => prev.width === rect.width && prev.height === rect.height ? prev : { width: rect.width, height: rect.height }
-      );
-    };
-    update();
-    if (typeof ResizeObserver === "undefined") return;
-    const ro = new ResizeObserver(update);
-    ro.observe(el);
-    return () => ro.disconnect();
-  }, [ref]);
-  return size;
-}
-function loupeSourcePoint(p, rect, aim, factor) {
-  return {
-    x: aim.x + (p.x - (rect.x + rect.w / 2)) / factor,
-    y: aim.y + (p.y - (rect.y + rect.h / 2)) / factor
-  };
-}
-function createLoupeModel(opts) {
-  const { surface } = opts;
-  let mode = opts.mode ?? "vector";
-  let factor = normalizeZoom(opts.factor ?? 8);
-  let aim = { x: 0, y: 0 };
-  let color = null;
-  let disposed = false;
-  let aimUnsampled = false;
-  const clamp = (n) => normalizeZoom(Math.min(
-    opts.maxFactor ?? Number.POSITIVE_INFINITY,
-    Math.max(opts.minFactor ?? Number.NEGATIVE_INFINITY, n)
-  ));
-  const sampleColor = () => {
-    const hex = surface.sample(aim);
-    if (hex === null || hex === color) return;
-    color = hex;
-    opts.onColorChange?.(hex);
-  };
-  const unsubscribeFrame = surface.subscribeFrame?.(() => {
-    if (!aimUnsampled) return;
-    aimUnsampled = false;
-    sampleColor();
-  });
-  const teardown = () => {
-    if (disposed) return;
-    disposed = true;
-    unsubscribeFrame?.();
-    opts.onDispose?.();
-  };
-  return {
-    get mode() {
-      return mode;
-    },
-    get factor() {
-      return factor;
-    },
-    get aim() {
-      return aim;
-    },
-    get color() {
-      return color;
-    },
-    setMode(next) {
-      if (disposed || next === mode) return;
-      mode = next;
-      surface.changed();
-    },
-    setFactor(next) {
-      if (disposed) return;
-      factor = clamp(next);
-      surface.changed();
-    },
-    aimAt(p) {
-      if (disposed) return;
-      if (surface.gone()) {
-        teardown();
-        return;
-      }
-      if (surface.hidden()) return;
-      if (surface.covers(p)) return;
-      aim = p;
-      if (unsubscribeFrame) aimUnsampled = true;
-      else sampleColor();
-      surface.changed();
-    },
-    pick(p) {
-      if (disposed) return null;
-      let at = aim;
-      if (p) {
-        const rect = surface.lens();
-        if (!rect) return null;
-        at = loupeSourcePoint(p, rect, aim, factor);
-        if (surface.covers(at)) return null;
-      }
-      const hex = surface.sample(at);
-      if (hex !== null) opts.onPick?.(hex);
-      return hex;
-    },
-    dispose: teardown
-  };
-}
-function useLoupe({ capability, hostRef, enabled, sample }) {
-  const [, bump] = useReducer((n) => n + 1, 0);
-  const overRef = useRef(false);
-  const peekingRef = useRef(false);
-  const enabledRef = useRef(enabled);
-  enabledRef.current = enabled;
-  const sampleRef = useRef(sample);
-  sampleRef.current = sample;
-  const onColorChangeRef = useRef(capability.onColorChange);
-  onColorChangeRef.current = capability.onColorChange;
-  const shown = useCallback(
-    () => overRef.current && (enabledRef.current || peekingRef.current),
-    []
-  );
-  const modelRef = useRef(null);
-  if (modelRef.current === null) {
-    modelRef.current = createLoupeModel({
-      mode: capability.mode,
-      factor: capability.factor,
-      minFactor: capability.minFactor,
-      maxFactor: capability.maxFactor,
-      onColorChange: (hex) => onColorChangeRef.current?.(hex),
-      surface: {
-        lens: () => {
-          const d = diameterRef.current;
-          const { x, y } = modelRef.current?.aim ?? { x: 0, y: 0 };
-          return { x: x - d / 2, y: y - d / 2, w: d, h: d };
-        },
-        // The lens follows the pointer and is painted over the host rather than
-        // into it, so it is never part of the picture being magnified.
-        covers: () => false,
-        sample: (p) => sampleRef.current?.(p) ?? null,
-        hidden: () => !shown(),
-        gone: () => goneRef.current,
-        changed: bump
-      }
-    });
-  }
-  const model = modelRef.current;
-  const diameterRef = useRef(capability.diameter);
-  diameterRef.current = capability.diameter;
-  const goneRef = useRef(false);
-  useEffect(() => {
-    goneRef.current = false;
-    return () => {
-      goneRef.current = true;
-    };
-  }, []);
-  useEffect(() => {
-    if (!enabled && !peekingRef.current) bump();
-  }, [enabled]);
-  useEffect(() => {
-    const host = hostRef.current;
-    if (!host) return;
-    const onPointerMove = (e) => {
-      overRef.current = true;
-      const rect = host.getBoundingClientRect();
-      model.aimAt({ x: e.clientX - rect.left, y: e.clientY - rect.top });
-      if (!shown()) return;
-      bump();
-    };
-    const onPointerLeave = () => {
-      overRef.current = false;
-      bump();
-    };
-    host.addEventListener("pointermove", onPointerMove);
-    host.addEventListener("pointerleave", onPointerLeave);
-    return () => {
-      host.removeEventListener("pointermove", onPointerMove);
-      host.removeEventListener("pointerleave", onPointerLeave);
-    };
-  }, [hostRef, model, shown]);
-  const inputRef = useRef(null);
-  if (inputRef.current === null) {
-    inputRef.current = {
-      shown,
-      setPeeking: (on) => {
-        if (peekingRef.current === on) return;
-        peekingRef.current = on;
-        bump();
-      },
-      magnifyBy: (deltaY) => {
-        const m = modelRef.current;
-        if (m) m.setFactor(m.factor * Math.exp(-deltaY * WHEEL_RATE));
-      }
-    };
-  }
-  return {
-    visible: shown(),
-    aim: model.aim,
-    factor: model.factor,
-    mode: model.mode,
-    color: model.color,
-    setMode: model.setMode,
-    setFactor: model.setFactor,
-    pick: model.pick,
-    input: inputRef.current
-  };
-}
-var NO_HOST = { current: null };
-function TrialLoupe({
-  capability,
-  enabled,
-  state,
-  config,
-  view,
-  worldSpec,
-  hostRef
-}) {
-  const stack = useContext(CanvasStackContext);
-  const surface = capability.render ? void 0 : stack?.surface;
-  const host = surface?.element ?? hostRef ?? NO_HOST;
-  const sample = useMemo(() => {
-    if (!surface) return void 0;
-    return (p) => {
-      const canvases = surface.canvases.current;
-      return canvases ? sampleStack(surface.layers, canvases, p, surface.size.dpr) : null;
-    };
-  }, [surface]);
-  const loupe = useLoupe({ capability, hostRef: host, enabled, sample });
-  const measured = useHostSize(host);
-  const size = surface?.size ?? measured;
-  const gestures = /* @__PURE__ */ jsx(CameraScope, { children: /* @__PURE__ */ jsx(LoupeGestures, { hostRef: host, input: loupe.input, peekKey: capability.peekKey ?? null }) });
-  if (!loupe.visible) return gestures;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    gestures,
-    /* @__PURE__ */ jsx(LoupeBubble, { aim: loupe.aim, diameter: capability.diameter, children: capability.render ? /* @__PURE__ */ jsx(
-      DomLoupe,
-      {
-        aim: loupe.aim,
-        factor: loupe.factor,
-        mode: loupe.mode,
-        diameter: capability.diameter,
-        size,
-        view,
-        frame: stack?.frame,
-        state,
-        config,
-        render: capability.render
-      }
-    ) : surface && stack ? /* @__PURE__ */ jsx(
-      CanvasLoupe,
-      {
-        aim: loupe.aim,
-        factor: loupe.factor,
-        mode: loupe.mode,
-        diameter: capability.diameter,
-        surface,
-        view: stack.view,
-        frame: stack.frame,
-        worldSpec
-      }
-    ) : null })
-  ] });
-}
-
-// src/loupe/types.ts
-var LOUPE_DEFAULTS = {
-  factor: 6,
-  minFactor: 2,
-  maxFactor: 32,
-  mode: "vector",
-  diameter: 200,
-  peekKey: "Alt"
-};
-function resolveLoupe(declared) {
-  const cap = declared === true ? {} : declared;
-  const minFactor = cap.minFactor ?? LOUPE_DEFAULTS.minFactor;
-  const maxFactor = cap.maxFactor ?? LOUPE_DEFAULTS.maxFactor;
-  return {
-    render: cap.render,
-    onColorChange: cap.onColorChange,
-    minFactor,
-    maxFactor,
-    factor: Math.min(maxFactor, Math.max(minFactor, cap.factor ?? LOUPE_DEFAULTS.factor)),
-    diameter: cap.diameter ?? LOUPE_DEFAULTS.diameter,
-    peekKey: cap.peekKey === void 0 ? LOUPE_DEFAULTS.peekKey : cap.peekKey,
-    // A DOM loupe has no framebuffer, so `pixel` would have nothing to enlarge.
-    mode: cap.render ? "vector" : cap.mode ?? LOUPE_DEFAULTS.mode
-  };
-}
-
-export { CanvasLoupe, DomLoupe, LOUPE_DEFAULTS, LOUPE_MAGNIFY_ID, LOUPE_PEEK_ID, LoupeBubble, LoupeGestures, TrialLoupe, createLoupeActions, drawCanvasLens, lensCamera, lensSourceRect, resolveLoupe, sampleStack, useLoupe };
-//# sourceMappingURL=chunk-M7HP3FTK.js.map
-//# sourceMappingURL=chunk-M7HP3FTK.js.map