@toolpath/viewer 0.3.1 → 1.0.0

package/dist/{chunk-RICG6UVH.js → chunk-4BU4QZCL.js}

@@ -1,10 +1,10 @@
 // src/engine/engine-part.tsx
-import { useEffect as useEffect5, useMemo as useMemo6 } from "react";
+import { useEffect as useEffect6, useMemo as useMemo7 } from "react";
 
 // src/part-mesh.tsx
-import { useThree as useThree6 } from "@react-three/fiber";
-import { useCallback as useCallback3, useEffect as useEffect4, useLayoutEffect, useMemo as useMemo5, useRef as useRef5 } from "react";
-import { Vector3 as Vector38 } from "three";
+import { useThree as useThree7 } from "@react-three/fiber";
+import { useCallback as useCallback3, useEffect as useEffect5, useLayoutEffect, useMemo as useMemo6, useRef as useRef6 } from "react";
+import { Vector3 as Vector310 } from "three";
 
 // src/model/directions.ts
 var EPSILON = 1e-6;
@@ -54,34 +54,48 @@ var HIGHLIGHT_COLORS = {
   geometryIssue: 16711680
 };
 var DIRECTION_COLORS = [
+  /*
+   * Nine ways up, told apart at a glance.
+   *
+   * The palette is an **identity**, not a ranking — the same colour on the
+   * face, on the arrow and on the row, which is the whole point of it. Two
+   * entries that look alike make it a worse identity than eight that do not,
+   * and this list had three problems at once:
+   *
+   * - teal-500, cyan-500 and emerald-500 were neighbours in hue *and*
+   *   lightness, so three ways up were one blue-green smear;
+   * - blue-500 and indigo-500 were the closest pair of all;
+   * - indigo-500 sat 0.06 from the violet an offer is painted in — the very
+   *   clash that sent a purple out of this list once already, still here under
+   *   a different name.
+   *
+   * The warm ramp belongs to difficulty, red to sharp corners, orange to the
+   * selection over this cycle, violet to an offer. There is no room to move
+   * anything to a fresh hue, so the spread is along **lightness** as much as
+   * hue: a pale cyan and a mid teal, a light green and a deep navy.
+   *
+   * `selection-colors.test.ts` measures every pair in Oklab and holds them all
+   * above 0.1 — including against the four colours the part can wear over this
+   * wash. The binding pair now is blue against an offer's violet, at 0.12.
+   */
   3900150,
   // blue
-  1357990,
+  889992,
   // teal
   14239471,
   // fuchsia
-  440020,
-  // cyan
-  /*
-   * Olive, where a purple used to be.
-   *
-   * The purple sat one step from the violet a proposed feature is painted in,
-   * so an offer laid over work already assigned to this direction was a clash
-   * between "suggested" and "decided" — the two states the part is read for.
-   * Olive is the only hue with room: the warm ramp belongs to the difficulty
-   * bands, red to sharp corners, orange to faces being picked, and green to
-   * whatever is being looked at.
-   */
+  6809849,
+  // pale cyan
   6660877,
   // olive
   15485081,
   // pink
-  6583435,
-  // slate
-  1096065,
-  // emerald
-  6514417
-  // indigo
+  9741240,
+  // light slate
+  4906624,
+  // light green
+  1981066
+  // deep navy
 ];
 var DEFAULT_THEME = {
   background: null,
@@ -164,7 +178,7 @@ function applyHighlightLayers(part, layers, theme) {
 }
 
 // src/render/section.ts
-import { OrthographicCamera, Plane, Vector3 } from "three";
+import { Plane, Vector3 } from "three";
 var SECTION_RENDER_ORDER = {
   stencil: 1,
   cap: 2,
@@ -233,12 +247,6 @@ function sectionPlane(box, normal, offset, into = new Plane()) {
   const axis = unit(normal);
   return into.set(axis, sectionConstant(sectionBounds(box, normal), offset));
 }
-function screenLength(camera, point, viewport, pixels) {
-  const height = viewport.height > 0 ? viewport.height : 1;
-  const zoom = camera.zoom || 1;
-  const visible = camera instanceof OrthographicCamera ? (camera.top - camera.bottom) / zoom : 2 * Math.tan(camera.fov / 2 * Math.PI / 180) * Math.max(camera.position.distanceTo(point), EPSILON2) / zoom;
-  return visible / height * pixels;
-}
 function dragPlane(axis, view, point, into = new Plane()) {
   const along = axis.lengthSq() === 0 ? ARROW_AXIS.clone() : axis.clone().normalize();
   const side = new Vector3().crossVectors(view, along);
@@ -252,7 +260,13 @@ function perpendicular(axis) {
 
 // src/tap.tsx
 import { useThree } from "@react-three/fiber";
-import { useEffect, useMemo, useRef } from "react";
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useMemo,
+  useRef
+} from "react";
 
 // src/render/tap.ts
 var TAP_SLOP = 4;
@@ -272,20 +286,43 @@ function trackTaps(element) {
     dispose: () => element.removeEventListener("pointerdown", down, { capture: true })
   };
 }
+var DOUBLE_TAP_MS = 400;
+function trackDoubleTaps(within = DOUBLE_TAP_MS, slop = TAP_SLOP) {
+  let last = null;
+  return {
+    isDouble: (event) => {
+      const paired = last !== null && event.timeStamp - last.timeStamp <= within && !movedFar(last, event, slop);
+      last = paired ? null : event;
+      return paired;
+    },
+    reset: () => {
+      last = null;
+    }
+  };
+}
 
 // src/tap.tsx
+import { jsx } from "react/jsx-runtime";
+var ViewerTapContext = createContext(null);
+var ViewerTapProvider = ({ value, children }) => /* @__PURE__ */ jsx(ViewerTapContext.Provider, { value, children });
 function useTapGuard() {
+  const shared = useContext(ViewerTapContext);
   const domElement = useThree((state) => state.gl.domElement);
   const tracker = useRef(null);
   useEffect(() => {
+    if (shared) return;
     const tracked = trackTaps(domElement);
     tracker.current = tracked;
     return () => {
       tracked.dispose();
       if (tracker.current === tracked) tracker.current = null;
     };
-  }, [domElement]);
-  return useMemo(() => (event) => tracker.current?.isTap(event) ?? true, []);
+  }, [domElement, shared]);
+  const own = useMemo(
+    () => (event) => tracker.current?.isTap(event) ?? true,
+    []
+  );
+  return shared ?? own;
 }
 
 // src/render/part.ts
@@ -391,10 +428,11 @@ function buildRegionAttribute(model, texels, vertexCount) {
 function createPart(model, geometry, theme) {
   const position = geometry.getAttribute("position");
   const texels = buildRegionTexels(model);
-  geometry.setAttribute(
-    REGION_ATTRIBUTE,
-    new Float32BufferAttribute2(buildRegionAttribute(model, texels, position.count), 1)
+  const regionAttribute = new Float32BufferAttribute2(
+    buildRegionAttribute(model, texels, position.count),
+    1
   );
+  geometry.setAttribute(REGION_ATTRIBUTE, regionAttribute);
   const width = model.regions.length + 1;
   const state = new Uint8Array(width * 4);
   const stateTexture = new DataTexture(state, width, 1, RGBAFormat, UnsignedByteType);
@@ -430,7 +468,8 @@ function createPart(model, geometry, theme) {
       "#include <color_fragment>",
       `#include <color_fragment>
         regionState = texelFetch(uRegionState, ivec2(int(vRegion + 0.5), 0), 0);
-        diffuseColor.rgb = mix(diffuseColor.rgb, regionState.rgb, regionState.a);`
+        diffuseColor.rgb = mix(diffuseColor.rgb, regionState.rgb, regionState.a);
+`
     ).replace(
       "#include <emissivemap_fragment>",
       `#include <emissivemap_fragment>
@@ -520,7 +559,9 @@ function createPart(model, geometry, theme) {
     },
     dispose() {
       object.clear();
-      geometry.deleteAttribute(REGION_ATTRIBUTE);
+      if (geometry.getAttribute(REGION_ATTRIBUTE) === regionAttribute) {
+        geometry.deleteAttribute(REGION_ATTRIBUTE);
+      }
       material.dispose();
       edgeGeometry.dispose();
       edgeMaterial.dispose();
@@ -529,6 +570,48 @@ function createPart(model, geometry, theme) {
   };
 }
 
+// src/render/adjacency.ts
+var GRID = 1e-4;
+var keyFor = (x, y, z) => `${Math.round(x / GRID)},${Math.round(y / GRID)},${Math.round(z / GRID)}`;
+function regionAdjacency(model, geometry) {
+  const position = geometry.getAttribute("position");
+  const adjacency = /* @__PURE__ */ new Map();
+  if (!position) return adjacency;
+  const owner = new Int32Array(Math.floor(position.count / 3)).fill(-1);
+  for (const region of model.regions) {
+    for (let at = region.triangles.start; at < region.triangles.end; at++) {
+      if (at >= 0 && at < owner.length) owner[at] = region.idx;
+    }
+  }
+  const edges = /* @__PURE__ */ new Map();
+  const join = (a, b) => {
+    if (a === b) return;
+    const mine = adjacency.get(a) ?? /* @__PURE__ */ new Set();
+    mine.add(b);
+    adjacency.set(a, mine);
+    const theirs = adjacency.get(b) ?? /* @__PURE__ */ new Set();
+    theirs.add(a);
+    adjacency.set(b, theirs);
+  };
+  for (let triangle = 0; triangle < owner.length; triangle++) {
+    const region = owner[triangle];
+    if (region === -1) continue;
+    const corners = [0, 1, 2].map((corner) => {
+      const at = triangle * 3 + corner;
+      return keyFor(position.getX(at), position.getY(at), position.getZ(at));
+    });
+    for (let corner = 0; corner < 3; corner++) {
+      const from = corners[corner];
+      const to = corners[(corner + 1) % 3];
+      const edge = from < to ? `${from}|${to}` : `${to}|${from}`;
+      const seen = edges.get(edge);
+      if (seen === void 0) edges.set(edge, region);
+      else join(seen, region);
+    }
+  }
+  return adjacency;
+}
+
 // src/render/selection.ts
 var FEATURE_TYPE_RANKS = [
   ["blind_hole", "through_hole", "filleted_blind_hole"],
@@ -616,7 +699,8 @@ function buildPick(input) {
     triangleIndex: input.triangleIndex,
     point: input.point,
     normal: input.normal,
-    modifiers: input.modifiers ?? NO_MODIFIERS
+    modifiers: input.modifiers ?? NO_MODIFIERS,
+    doubled: input.doubled ?? false
   };
 }
 function focusForPick(pick, previousRegion, previousFocus) {
@@ -627,25 +711,25 @@ function focusForPick(pick, previousRegion, previousFocus) {
 }
 
 // src/viewer.tsx
-import { Canvas, useFrame as useFrame2, useThree as useThree3 } from "@react-three/fiber";
+import { Canvas, useFrame as useFrame3, useThree as useThree4 } from "@react-three/fiber";
 import {
-  createContext,
+  createContext as createContext2,
   forwardRef,
   useCallback,
-  useContext,
-  useEffect as useEffect3,
+  useContext as useContext2,
+  useEffect as useEffect4,
   useImperativeHandle,
-  useMemo as useMemo3,
-  useRef as useRef2
+  useMemo as useMemo4,
+  useRef as useRef3
 } from "react";
-import { Box3 as Box33, Vector3 as Vector35 } from "three";
+import { Box3 as Box33, Vector3 as Vector37 } from "three";
 
 // src/camera.tsx
 import { useFrame, useThree as useThree2 } from "@react-three/fiber";
 import { useEffect as useEffect2, useMemo as useMemo2 } from "react";
 
 // src/render/camera.ts
-import { OrthographicCamera as OrthographicCamera2, Vector3 as Vector33 } from "three";
+import { OrthographicCamera, Vector3 as Vector33 } from "three";
 var PERSPECTIVE_FOV = 30;
 var DEFAULT_FIT_MARGIN = 1.2;
 var EXCLUDE_FROM_FRAME = "viewerExcludeFromFrame";
@@ -655,6 +739,13 @@ function defaultBounds() {
 function aspectRatio(size) {
   return size.width > 0 && size.height > 0 ? size.width / size.height : 1;
 }
+var SCREEN_LENGTH_EPSILON = 1e-9;
+function screenLength(camera, point, viewport, pixels) {
+  const height = viewport.height > 0 ? viewport.height : 1;
+  const zoom = camera.zoom || 1;
+  const visible = camera instanceof OrthographicCamera ? (camera.top - camera.bottom) / zoom : 2 * Math.tan(camera.fov / 2 * Math.PI / 180) * Math.max(camera.position.distanceTo(point), SCREEN_LENGTH_EPSILON) / zoom;
+  return visible / height * pixels;
+}
 function boundsFromBox(box) {
   if (box.isEmpty()) return defaultBounds();
   const center = box.getCenter(new Vector33());
@@ -703,10 +794,53 @@ function startPosition(projection, size, bounds, margin = DEFAULT_FIT_MARGIN) {
   const [x, y, z] = START_DIRECTION[projection];
   return new Vector33(x, y, z).normalize().multiplyScalar(fitDistance(projection, size, bounds, margin)).add(bounds.center);
 }
+var MIN_FRAME_RATIO = 0.25;
+var MAX_FRAME_RATIO = 10;
+var TARGET_BOUNDARY_RATIO = 4;
+function cameraLimits(projection, size, bounds, margin = DEFAULT_FIT_MARGIN, framed) {
+  const fit = fitDistance(projection, size, bounds, margin);
+  const framedRadius = framed && framed.radius > 0 ? framed.radius : bounds.radius;
+  if (projection === "orthographic") {
+    const reach = bounds.radius > 0 ? bounds.radius / framedRadius : 1;
+    return {
+      minZoom: Math.min(MIN_FRAME_RATIO, MIN_FRAME_RATIO * reach),
+      maxZoom: Math.max(MAX_FRAME_RATIO, MAX_FRAME_RATIO * reach),
+      // Distance does not change apparent size under an orthographic camera, so
+      // these are not the zoom clamps in another form — they only keep the
+      // camera clear of the geometry it is looking at, and bounded.
+      minDistance: bounds.radius * margin,
+      maxDistance: fit / MIN_FRAME_RATIO
+    };
+  }
+  const framedFit = fitDistance(
+    projection,
+    size,
+    framedRadius === bounds.radius ? bounds : { ...bounds, radius: framedRadius },
+    margin
+  );
+  return {
+    // The wheel is `ACTION.DOLLY` under a perspective camera, so nothing here
+    // moves `camera.zoom`. They are set to the same pair anyway: a consumer
+    // that does zoom should not find the two cameras disagreeing about how far
+    // in is too far.
+    minZoom: MIN_FRAME_RATIO,
+    maxZoom: MAX_FRAME_RATIO,
+    minDistance: Math.min(fit, framedFit) / MAX_FRAME_RATIO,
+    maxDistance: Math.max(fit, framedFit) / MIN_FRAME_RATIO
+  };
+}
+var scratchBoundarySize = new Vector33();
+function targetBoundary(bounds, into, margin = DEFAULT_FIT_MARGIN) {
+  const reach = bounds.radius * margin * TARGET_BOUNDARY_RATIO;
+  return into.setFromCenterAndSize(
+    bounds.center,
+    scratchBoundarySize.set(reach * 2, reach * 2, reach * 2)
+  );
+}
 function applyProjection(camera, size, bounds, margin = DEFAULT_FIT_MARGIN) {
   const aspect = aspectRatio(size);
   const radius = bounds.radius * margin;
-  if (camera instanceof OrthographicCamera2) {
+  if (camera instanceof OrthographicCamera) {
     const halfHeight = orthographicHalfHeight(aspect, radius);
     const halfWidth = halfHeight * aspect;
     camera.left = -halfWidth;
@@ -726,6 +860,11 @@ function applyProjection(camera, size, bounds, margin = DEFAULT_FIT_MARGIN) {
   camera.updateProjectionMatrix();
 }
 var CAD_CAMERA_UP = new Vector33(0, 0, 1);
+var scratchSide = new Vector33();
+function adaptedUp(view, up, into) {
+  const side = scratchSide.crossVectors(view, up).normalize();
+  return into.crossVectors(side, view).normalize();
+}
 var cadViewDirections = {
   front: new Vector33(0, -1, 0),
   back: new Vector33(0, 1, 0),
@@ -746,7 +885,7 @@ import CameraControls from "camera-controls";
 import {
   Box3 as Box32,
   Matrix4,
-  OrthographicCamera as OrthographicCamera3,
+  OrthographicCamera as OrthographicCamera2,
   Quaternion,
   Raycaster,
   Sphere,
@@ -773,6 +912,8 @@ var FUSION_PINCH_ZOOM_SCALE = 0.04;
 var FUSION_ROTATE_SCALE = 2.2;
 var FUSION_TRUCK_SCALE = 0.33;
 var DEFAULT_SMOOTH_TIME = 1e-3;
+var DOLLY_SPEED = 1.15;
+var REST_THRESHOLD = 5e-3;
 var ExtendedCameraControls = class extends CameraControls {
   #domElement;
   #freeOrbit;
@@ -787,13 +928,34 @@ var ExtendedCameraControls = class extends CameraControls {
   #scratchA = new Vector34();
   #scratchB = new Vector34();
   #scratchC = new Vector34();
-  #scratchD = new Vector34();
   constructor(camera, domElement, options = {}) {
     super(camera, domElement);
     this.#domElement = domElement;
     this.#freeOrbit = options.freeOrbit ?? true;
     this.azimuthRotateSpeed = 0;
     this.polarRotateSpeed = 0;
+    this.dollySpeed = DOLLY_SPEED;
+    this.restThreshold = REST_THRESHOLD;
+  }
+  /**
+   * Bounds how far the wheel may travel, and where the orbit target may go.
+   *
+   * Re-applied whenever the scene is re-measured rather than set once: the
+   * limits are derived from the part's bounds, and a viewer that loads a second
+   * part would otherwise keep the first part's idea of far.
+   *
+   * The boundary confines the *target*. Zoom-to-cursor moves it, and goes on
+   * moving it after the zoom clamp bites — which is a runaway no zoom clamp can
+   * catch. `boundaryEnclosesCamera` stays off: under an orthographic camera the
+   * camera sits well outside the framing it is looking at, so enclosing it would
+   * drag the target back in on every frame.
+   */
+  applyLimits(limits, boundary) {
+    this.minZoom = limits.minZoom;
+    this.maxZoom = limits.maxZoom;
+    this.minDistance = limits.minDistance;
+    this.maxDistance = limits.maxDistance;
+    this.setBoundary(boundary);
   }
   get freeOrbit() {
     return this.#freeOrbit;
@@ -863,7 +1025,7 @@ var ExtendedCameraControls = class extends CameraControls {
     this.mouseButtons.left = CameraControls.ACTION.ROTATE;
     this.mouseButtons.right = CameraControls.ACTION.TRUCK;
     this.mouseButtons.middle = CameraControls.ACTION.TRUCK;
-    this.mouseButtons.wheel = this.camera instanceof OrthographicCamera3 ? CameraControls.ACTION.ZOOM : CameraControls.ACTION.DOLLY;
+    this.mouseButtons.wheel = this.camera instanceof OrthographicCamera2 ? CameraControls.ACTION.ZOOM : CameraControls.ACTION.DOLLY;
   }
   setFreeOrbit(freeOrbit) {
     if (this.#freeOrbit === freeOrbit) {
@@ -921,9 +1083,7 @@ var ExtendedCameraControls = class extends CameraControls {
   #adaptUpVector = () => {
     const target = this.getTarget(this.#scratchA);
     const view = this.#scratchB.subVectors(target, this.camera.position).normalize();
-    const side = this.#scratchC.crossVectors(view, this.camera.up).normalize();
-    const up = this.#scratchD.crossVectors(side, view).normalize();
-    this.camera.up.copy(up);
+    this.camera.up.copy(adaptedUp(view, this.camera.up, this.#scratchC));
     const position = this.getPosition(this.#scratchA);
     this.updateCameraUp();
     void this.setPosition(position.x, position.y, position.z, false);
@@ -990,7 +1150,8 @@ var ExtendedCameraControls = class extends CameraControls {
 var CadCameraControls = ({
   controlsRef,
   scheme = "toolpath",
-  freeOrbit = true
+  freeOrbit = true,
+  zoomTo = "cursor"
 }) => {
   const camera = useThree2((state) => state.camera);
   const domElement = useThree2((state) => state.gl.domElement);
@@ -1029,46 +1190,470 @@ var CadCameraControls = ({
   useEffect2(() => {
     controls.setFreeOrbit(freeOrbit);
   }, [controls, freeOrbit]);
+  useEffect2(() => {
+    controls.dollyToCursor = zoomTo === "cursor";
+  }, [controls, zoomTo]);
   useFrame((_, delta) => {
     controls.update(delta);
   });
   return null;
 };
 
+// src/render/retarget.ts
+function retargetPose(cameraPosition, currentTarget, hitPoint) {
+  const dx = hitPoint.x - currentTarget.x;
+  const dy = hitPoint.y - currentTarget.y;
+  const dz = hitPoint.z - currentTarget.z;
+  return {
+    position: {
+      x: cameraPosition.x + dx,
+      y: cameraPosition.y + dy,
+      z: cameraPosition.z + dz
+    },
+    target: { x: hitPoint.x, y: hitPoint.y, z: hitPoint.z }
+  };
+}
+
+// src/target-marker.tsx
+import { useFrame as useFrame2, useThree as useThree3 } from "@react-three/fiber";
+import { useEffect as useEffect3, useMemo as useMemo3, useRef as useRef2 } from "react";
+import {
+  DoubleSide,
+  RingGeometry,
+  SphereGeometry,
+  Vector3 as Vector35
+} from "three";
+
+// src/render/target.ts
+var ORBIT_TARGET_PIXELS = 3;
+var ORBIT_TARGET_RING_PIXELS = 14;
+var ORBIT_TARGET_RING_WIDTH = 0.16;
+var ORBIT_TARGET_COLOR = 3948625;
+var ORBIT_TARGET_RING_COLOR = 7057587;
+var ORBIT_TARGET_RING_OPACITY = 0.9;
+var ORBIT_TARGET_FLASH_MS = 100;
+var ORBIT_TARGET_FADE_MS = 1e3;
+function orbitTargetOpacity(sinceHold, fade = ORBIT_TARGET_FADE_MS) {
+  if (sinceHold <= 0) return 1;
+  if (fade <= 0 || sinceHold >= fade) return 0;
+  return 1 - sinceHold / fade;
+}
+
+// src/target-marker.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+var FURNITURE = { [EXCLUDE_FROM_FRAME]: true };
+var TargetMarker = ({ controlsRef }) => {
+  const camera = useThree3((state) => state.camera);
+  const size = useThree3((state) => state.size);
+  const invalidate = useThree3((state) => state.invalidate);
+  const registered = useThree3((state) => state.controls);
+  const group = useRef2(null);
+  const ring = useRef2(null);
+  const dotMaterial = useRef2(null);
+  const ringMaterial = useRef2(null);
+  const dotGeometry = useMemo3(() => new SphereGeometry(1, 16, 12), []);
+  const ringGeometry = useMemo3(() => new RingGeometry(1 - ORBIT_TARGET_RING_WIDTH, 1, 48), []);
+  useEffect3(
+    () => () => {
+      dotGeometry.dispose();
+      ringGeometry.dispose();
+    },
+    [dotGeometry, ringGeometry]
+  );
+  const dragging = useRef2(false);
+  const heldUntil = useRef2(0);
+  const painted = useRef2(-1);
+  const placed = useRef2(false);
+  const lastTarget = useMemo3(() => new Vector35(), []);
+  const scratch = useMemo3(() => new Vector35(), []);
+  useEffect3(() => {
+    const controls = controlsRef.current;
+    if (!controls) return void 0;
+    const start = () => {
+      dragging.current = true;
+      invalidate();
+    };
+    const end = () => {
+      dragging.current = false;
+      heldUntil.current = performance.now();
+      invalidate();
+    };
+    controls.addEventListener("controlstart", start);
+    controls.addEventListener("controlend", end);
+    return () => {
+      controls.removeEventListener("controlstart", start);
+      controls.removeEventListener("controlend", end);
+    };
+  }, [controlsRef, invalidate, registered]);
+  useFrame2(() => {
+    const controls = controlsRef.current;
+    const node = group.current;
+    if (!controls || !node) return;
+    const now = performance.now();
+    const target = controls.getTarget(scratch);
+    if (!placed.current) {
+      placed.current = true;
+      lastTarget.copy(target);
+      node.position.copy(target);
+    } else if (!target.equals(lastTarget)) {
+      lastTarget.copy(target);
+      node.position.copy(target);
+      heldUntil.current = Math.max(heldUntil.current, now + ORBIT_TARGET_FLASH_MS);
+    }
+    const opacity = dragging.current ? 1 : orbitTargetOpacity(now - heldUntil.current);
+    if (opacity !== painted.current) {
+      painted.current = opacity;
+      node.visible = opacity > 0;
+      if (dotMaterial.current) dotMaterial.current.opacity = opacity;
+      if (ringMaterial.current) ringMaterial.current.opacity = opacity * ORBIT_TARGET_RING_OPACITY;
+      invalidate();
+    }
+    if (node.visible) {
+      node.scale.setScalar(screenLength(camera, target, size, 1));
+      ring.current?.quaternion.copy(camera.quaternion);
+    }
+  });
+  return /* @__PURE__ */ jsxs("group", { ref: group, visible: false, userData: FURNITURE, children: [
+    /* @__PURE__ */ jsx2(
+      "mesh",
+      {
+        ref: ring,
+        geometry: ringGeometry,
+        scale: ORBIT_TARGET_RING_PIXELS,
+        renderOrder: 998,
+        raycast: () => null,
+        children: /* @__PURE__ */ jsx2(
+          "meshBasicMaterial",
+          {
+            ref: ringMaterial,
+            color: ORBIT_TARGET_RING_COLOR,
+            transparent: true,
+            opacity: 0,
+            depthTest: false,
+            depthWrite: false,
+            side: DoubleSide
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx2(
+      "mesh",
+      {
+        geometry: dotGeometry,
+        scale: ORBIT_TARGET_PIXELS,
+        renderOrder: 999,
+        raycast: () => null,
+        children: /* @__PURE__ */ jsx2(
+          "meshBasicMaterial",
+          {
+            ref: dotMaterial,
+            color: ORBIT_TARGET_COLOR,
+            transparent: true,
+            opacity: 0,
+            depthTest: false,
+            depthWrite: false
+          }
+        )
+      }
+    )
+  ] });
+};
+
+// src/render/view-cube.ts
+import {
+  BufferGeometry,
+  CanvasTexture,
+  Float32BufferAttribute as Float32BufferAttribute3,
+  SRGBColorSpace,
+  Vector3 as Vector36
+} from "three";
+var VIEW_NAMES = [
+  // The six faces.
+  "top",
+  "bottom",
+  "front",
+  "back",
+  "left",
+  "right",
+  // The twelve edges.
+  "top-front",
+  "top-back",
+  "top-left",
+  "top-right",
+  "bottom-front",
+  "bottom-back",
+  "bottom-left",
+  "bottom-right",
+  "front-left",
+  "front-right",
+  "back-left",
+  "back-right",
+  // The eight corners.
+  "top-front-left",
+  "top-front-right",
+  "top-back-left",
+  "top-back-right",
+  "bottom-front-left",
+  "bottom-front-right",
+  "bottom-back-left",
+  "bottom-back-right"
+];
+var VIEW_SIGNS = {
+  top: [0, 0, 1],
+  bottom: [0, 0, -1],
+  front: [0, -1, 0],
+  back: [0, 1, 0],
+  left: [-1, 0, 0],
+  right: [1, 0, 0],
+  "top-front": [0, -1, 1],
+  "top-back": [0, 1, 1],
+  "top-left": [-1, 0, 1],
+  "top-right": [1, 0, 1],
+  "bottom-front": [0, -1, -1],
+  "bottom-back": [0, 1, -1],
+  "bottom-left": [-1, 0, -1],
+  "bottom-right": [1, 0, -1],
+  "front-left": [-1, -1, 0],
+  "front-right": [1, -1, 0],
+  "back-left": [-1, 1, 0],
+  "back-right": [1, 1, 0],
+  "top-front-left": [-1, -1, 1],
+  "top-front-right": [1, -1, 1],
+  "top-back-left": [-1, 1, 1],
+  "top-back-right": [1, 1, 1],
+  "bottom-front-left": [-1, -1, -1],
+  "bottom-front-right": [1, -1, -1],
+  "bottom-back-left": [-1, 1, -1],
+  "bottom-back-right": [1, 1, -1]
+};
+function viewKind(name) {
+  const off = VIEW_SIGNS[name].filter((sign) => sign !== 0).length;
+  if (off === 1) return "face";
+  if (off === 2) return "edge";
+  return "corner";
+}
+var DIRECTIONS = new Map(
+  VIEW_NAMES.map((name) => {
+    const [x, y, z] = VIEW_SIGNS[name];
+    const length = Math.hypot(x, y, z);
+    return [name, { x: x / length, y: y / length, z: z / length }];
+  })
+);
+function viewVector(name) {
+  return DIRECTIONS.get(name) ?? { x: 0, y: 0, z: 1 };
+}
+function viewUp(direction) {
+  if (direction.x === 0 && direction.y === 0) {
+    return { x: 0, y: direction.z > 0 ? 1 : -1, z: 0 };
+  }
+  return { x: 0, y: 0, z: 1 };
+}
+function squaredUp(direction, currentUp) {
+  const forward = new Vector36(direction.x, direction.y, direction.z).normalize();
+  const canonical = viewUp(direction);
+  const zero = new Vector36(canonical.x, canonical.y, canonical.z);
+  zero.addScaledVector(forward, -forward.dot(zero)).normalize();
+  const quarter = new Vector36().crossVectors(forward, zero);
+  const current = new Vector36(currentUp.x, currentUp.y, currentUp.z);
+  const rolls = [zero, quarter, zero.clone().negate(), quarter.clone().negate()];
+  const nearest = rolls.reduce(
+    (best, roll) => roll.dot(current) > best.dot(current) ? roll : best
+  );
+  return vec(nearest);
+}
+var CHAMFER = 0.5834;
+function vec(v) {
+  return { x: v.x, y: v.y, z: v.z };
+}
+function cubeZones(chamfer = CHAMFER) {
+  const AXES = [0, 1, 2];
+  return VIEW_NAMES.map((name) => {
+    const kind = viewKind(name);
+    const direction = viewVector(name);
+    const [sx, sy, sz] = VIEW_SIGNS[name];
+    const sign = (axis) => VIEW_SIGNS[name][axis] ?? 0;
+    const normal = new Vector36(direction.x, direction.y, direction.z);
+    let polygon;
+    if (kind === "face") {
+      const up = viewUp(direction);
+      const upVector = new Vector36(up.x, up.y, up.z);
+      const right = normal.clone().negate().cross(upVector).normalize();
+      const square = [
+        [-1, -1],
+        [1, -1],
+        [1, 1],
+        [-1, 1]
+      ];
+      polygon = square.map(
+        ([u, v]) => normal.clone().addScaledVector(right, u * chamfer).addScaledVector(upVector, v * chamfer)
+      );
+    } else if (kind === "edge") {
+      const a = AXES.find((axis) => sign(axis) !== 0) ?? 0;
+      const b = [...AXES].reverse().find((axis) => sign(axis) !== 0) ?? 0;
+      const c = AXES.find((axis) => sign(axis) === 0) ?? 0;
+      const rectangle = [
+        [1, chamfer, -chamfer],
+        [1, chamfer, chamfer],
+        [chamfer, 1, chamfer],
+        [chamfer, 1, -chamfer]
+      ];
+      polygon = rectangle.map(
+        ([onA, onB, onC]) => new Vector36().setComponent(a, sign(a) * onA).setComponent(b, sign(b) * onB).setComponent(c, onC)
+      );
+    } else {
+      const triangle = [
+        [1, chamfer, chamfer],
+        [chamfer, 1, chamfer],
+        [chamfer, chamfer, 1]
+      ];
+      polygon = triangle.map(([onX, onY, onZ]) => new Vector36(sx * onX, sy * onY, sz * onZ));
+    }
+    const [first, second, third] = polygon;
+    if (first && second && third) {
+      const facing = new Vector36().subVectors(second, first).cross(new Vector36().subVectors(third, first));
+      if (facing.dot(normal) < 0) polygon.reverse();
+    }
+    return { name, kind, direction, polygon: polygon.map(vec) };
+  });
+}
+function panelGeometry(zone) {
+  const positions = [];
+  const normals = [];
+  const [first] = zone.polygon;
+  const geometry = new BufferGeometry();
+  if (!first) return geometry;
+  for (let index = 1; index + 1 < zone.polygon.length; index += 1) {
+    const b = zone.polygon[index];
+    const c = zone.polygon[index + 1];
+    if (!b || !c) continue;
+    positions.push(first.x, first.y, first.z, b.x, b.y, b.z, c.x, c.y, c.z);
+    for (let vertex = 0; vertex < 3; vertex += 1) {
+      normals.push(zone.direction.x, zone.direction.y, zone.direction.z);
+    }
+  }
+  geometry.setAttribute("position", new Float32BufferAttribute3(positions, 3));
+  geometry.setAttribute("normal", new Float32BufferAttribute3(normals, 3));
+  return geometry;
+}
+function cubeOutlineGeometry(zones) {
+  const positions = [];
+  for (const zone of zones) {
+    for (let index = 0; index < zone.polygon.length; index += 1) {
+      const from = zone.polygon[index];
+      const to = zone.polygon[(index + 1) % zone.polygon.length];
+      if (!from || !to) continue;
+      positions.push(from.x, from.y, from.z, to.x, to.y, to.z);
+    }
+  }
+  const geometry = new BufferGeometry();
+  geometry.setAttribute("position", new Float32BufferAttribute3(positions, 3));
+  return geometry;
+}
+function labelGeometry(zone) {
+  const positions = [];
+  const uvs = [];
+  const corners = [0, 1, 2, 0, 2, 3];
+  const corner = [
+    [0, 0],
+    [1, 0],
+    [1, 1],
+    [0, 1]
+  ];
+  for (const index of corners) {
+    const point = zone.polygon[index];
+    const uv = corner[index];
+    if (!point || !uv) continue;
+    positions.push(
+      point.x + zone.direction.x * 4e-3,
+      point.y + zone.direction.y * 4e-3,
+      point.z + zone.direction.z * 4e-3
+    );
+    uvs.push(uv[0] ?? 0, uv[1] ?? 0);
+  }
+  const geometry = new BufferGeometry();
+  geometry.setAttribute("position", new Float32BufferAttribute3(positions, 3));
+  geometry.setAttribute("uv", new Float32BufferAttribute3(uvs, 2));
+  return geometry;
+}
+function labelTexture(label, color) {
+  const size = 128;
+  const canvas = document.createElement("canvas");
+  canvas.width = size;
+  canvas.height = size;
+  const context = canvas.getContext("2d");
+  if (context) {
+    const text = label.toUpperCase();
+    const hex = `#${color.toString(16).padStart(6, "0")}`;
+    context.font = `600 ${size / 4}px system-ui, sans-serif`;
+    const width = context.measureText("BOTTOM").width || 1;
+    const scale = Math.min(1, size * 0.78 / width);
+    context.font = `600 ${size / 4 * scale}px system-ui, sans-serif`;
+    context.textAlign = "center";
+    context.textBaseline = "middle";
+    context.fillStyle = hex;
+    context.fillText(text, size / 2, size / 2);
+  }
+  const texture = new CanvasTexture(canvas);
+  texture.colorSpace = SRGBColorSpace;
+  texture.needsUpdate = true;
+  return texture;
+}
+
 // src/viewer.tsx
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var ViewerControlsContext = createContext(null);
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var ViewerControlsContext = createContext2(null);
 var useViewerControls = () => {
-  const controls = useContext(ViewerControlsContext);
+  const controls = useContext2(ViewerControlsContext);
   if (!controls) throw new Error("useViewerControls must be used inside <Viewer>");
   return controls;
 };
+var ViewerRetargetContext = createContext2(null);
+var useRetarget = () => useContext2(ViewerRetargetContext);
 var ViewerScene = ({
   children,
   setControls,
   projection,
   scheme,
   freeOrbit,
+  zoomTo,
+  recentreOnDoubleClick,
+  retargetOnDoubleClick,
+  showOrbitTarget,
   theme
 }) => {
-  const camera = useThree3((state) => state.camera);
-  const size = useThree3((state) => state.size);
-  const invalidate = useThree3((state) => state.invalidate);
-  const controlsRef = useRef2(null);
-  const contentRef = useRef2(null);
-  const lightsRef = useRef2(null);
-  const initialFrameComplete = useRef2(false);
-  const boundsRef = useRef2(defaultBounds());
-  const scratchBox = useMemo3(() => new Box33(), []);
-  const scratchDirection = useMemo3(() => new Vector35(), []);
-  const scratchView = useMemo3(() => new Vector35(), []);
+  const camera = useThree4((state) => state.camera);
+  const size = useThree4((state) => state.size);
+  const invalidate = useThree4((state) => state.invalidate);
+  const domElement = useThree4((state) => state.gl.domElement);
+  const isTap = useTapGuard();
+  const controlsRef = useRef3(null);
+  const contentRef = useRef3(null);
+  const lightsRef = useRef3(null);
+  const initialFrameComplete = useRef3(false);
+  const boundsRef = useRef3(defaultBounds());
+  const framedRef = useRef3(null);
+  const scratchBox = useMemo4(() => new Box33(), []);
+  const scratchBoundary = useMemo4(() => new Box33(), []);
+  const scratchDirection = useMemo4(() => new Vector37(), []);
+  const scratchView = useMemo4(() => new Vector37(), []);
+  const scratchTarget = useMemo4(() => new Vector37(), []);
+  const scratchPosition = useMemo4(() => new Vector37(), []);
+  const applyLimits = useCallback(
+    (bounds, framed) => {
+      controlsRef.current?.applyLimits(
+        cameraLimits(projection, size, bounds, DEFAULT_FIT_MARGIN, framed),
+        targetBoundary(bounds, scratchBoundary, DEFAULT_FIT_MARGIN)
+      );
+    },
+    [projection, scratchBoundary, size]
+  );
   const measure = useCallback(() => {
     const content = contentRef.current;
     boundsRef.current = content ? contentBounds(content, scratchBox) : defaultBounds();
     return boundsRef.current;
   }, [scratchBox]);
   const frame = useCallback(
-    (direction, transition = false) => {
+    (direction, transition = false, up) => {
       const controls = controlsRef.current;
       if (!controls) return false;
       const bounds = measure();
@@ -1076,6 +1661,10 @@ var ViewerScene = ({
       const distance = fitDistance(projection, size, bounds, DEFAULT_FIT_MARGIN);
       const position = scratchDirection.copy(direction).normalize().multiplyScalar(distance);
       position.add(bounds.center);
+      if (up) {
+        camera.up.set(up.x, up.y, up.z);
+        controls.updateCameraUp();
+      }
       void controls.setLookAt(
         position.x,
         position.y,
@@ -1086,17 +1675,19 @@ var ViewerScene = ({
         transition
       );
       if (projection === "orthographic") void controls.zoomTo(1, transition);
+      framedRef.current = null;
+      applyLimits(bounds);
       invalidate();
       return true;
     },
-    [camera, invalidate, measure, projection, scratchDirection, size]
+    [applyLimits, camera, invalidate, measure, projection, scratchDirection, size]
   );
   const frameBounds = useCallback(
     (bounds) => {
       const controls = controlsRef.current;
       if (!controls) return false;
-      const target = controls.getTarget(new Vector35());
-      const direction = currentViewDirection(camera, target, new Vector35());
+      const target = controls.getTarget(new Vector37());
+      const direction = currentViewDirection(camera, target, new Vector37());
       const distance = fitDistance(projection, size, bounds, DEFAULT_FIT_MARGIN);
       const position = direction.multiplyScalar(distance).add(bounds.center);
       void controls.setLookAt(
@@ -1108,26 +1699,65 @@ var ViewerScene = ({
         bounds.center.z,
         true
       );
+      framedRef.current = bounds;
+      applyLimits(boundsRef.current, bounds);
       if (projection === "orthographic") {
         void controls.zoomTo(boundsRef.current.radius / bounds.radius, true);
       }
       invalidate();
       return true;
     },
-    [camera, invalidate, projection, size]
+    [applyLimits, camera, invalidate, projection, size]
   );
   const fitContent = useCallback(() => {
     const controls = controlsRef.current;
     if (!controls) return false;
-    const target = controls.getTarget(new Vector35());
-    return frame(currentViewDirection(camera, target, new Vector35()), true);
+    const target = controls.getTarget(new Vector37());
+    return frame(currentViewDirection(camera, target, new Vector37()), true);
   }, [camera, frame]);
   const resetContent = useCallback(() => {
     const bounds = measure();
     const start = startPosition(projection, size, bounds).sub(bounds.center);
-    return frame(start, true);
+    return frame(start, true, CAD_CAMERA_UP);
   }, [frame, measure, projection, size]);
-  useEffect3(() => {
+  const retarget = useCallback(
+    (point) => {
+      const controls = controlsRef.current;
+      if (!controls) return;
+      const pose = retargetPose(
+        controls.getPosition(scratchPosition),
+        controls.getTarget(scratchTarget),
+        point
+      );
+      void controls.setLookAt(
+        pose.position.x,
+        pose.position.y,
+        pose.position.z,
+        pose.target.x,
+        pose.target.y,
+        pose.target.z,
+        true
+      );
+      invalidate();
+    },
+    [invalidate, scratchPosition, scratchTarget]
+  );
+  const retargetOn = useMemo4(
+    () => retargetOnDoubleClick ? retarget : null,
+    [retarget, retargetOnDoubleClick]
+  );
+  useEffect4(() => {
+    if (!recentreOnDoubleClick) return void 0;
+    const doubles = trackDoubleTaps();
+    const recentre = (event) => {
+      if (event.button !== 1) return;
+      if (!isTap(event)) return;
+      if (doubles.isDouble(event)) fitContent();
+    };
+    domElement.addEventListener("auxclick", recentre);
+    return () => domElement.removeEventListener("auxclick", recentre);
+  }, [domElement, fitContent, isTap, recentreOnDoubleClick]);
+  useEffect4(() => {
     setControls({
       fit: () => {
         fitContent();
@@ -1136,62 +1766,80 @@ var ViewerScene = ({
         resetContent();
       },
       setView: (view) => {
-        frame(cadViewDirections[view], true);
+        frame(cadViewDirections[view], true, squaredUp(cadViewDirections[view], camera.up));
       },
       setViewDirection: (direction) => {
-        frame(scratchView.set(direction.x, direction.y, direction.z), true);
+        frame(
+          scratchView.set(direction.x, direction.y, direction.z),
+          true,
+          squaredUp(direction, camera.up)
+        );
       },
       frameBox: (box) => {
         frameBounds(boundsFromBox(box));
       }
     });
-  }, [fitContent, frame, frameBounds, resetContent, scratchView, setControls]);
-  useEffect3(() => {
+  }, [camera, fitContent, frame, frameBounds, resetContent, scratchView, setControls]);
+  useEffect4(() => {
     if (initialFrameComplete.current) resetContent();
   }, [projection]);
-  useEffect3(() => {
+  useEffect4(() => {
     applyProjection(camera, size, boundsRef.current, DEFAULT_FIT_MARGIN);
+    if (initialFrameComplete.current) applyLimits(boundsRef.current, framedRef.current ?? void 0);
     invalidate();
-  }, [camera, invalidate, size]);
-  useFrame2(() => {
+  }, [applyLimits, camera, invalidate, size]);
+  useFrame3(() => {
     const lights = lightsRef.current;
     if (lights && !lights.quaternion.equals(camera.quaternion)) {
       lights.quaternion.copy(camera.quaternion);
       invalidate();
     }
   });
-  useFrame2(() => {
+  useFrame3(() => {
     if (!initialFrameComplete.current && contentRef.current?.children.length) {
       initialFrameComplete.current = resetContent();
     }
   });
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs("group", { ref: lightsRef, children: [
-      /* @__PURE__ */ jsx("ambientLight", { color: theme.ambient, intensity: theme.ambientIntensity }),
-      /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx3(ViewerTapProvider, { value: isTap, children: /* @__PURE__ */ jsxs2(ViewerRetargetContext.Provider, { value: retargetOn, children: [
+    /* @__PURE__ */ jsxs2("group", { ref: lightsRef, children: [
+      /* @__PURE__ */ jsx3("ambientLight", { color: theme.ambient, intensity: theme.ambientIntensity }),
+      /* @__PURE__ */ jsx3(
         "hemisphereLight",
         {
           args: [theme.hemisphereSky, theme.hemisphereGround, theme.hemisphereIntensity]
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("group", { ref: contentRef, children }),
-    /* @__PURE__ */ jsx(CadCameraControls, { controlsRef, scheme, freeOrbit })
-  ] });
+    /* @__PURE__ */ jsx3("group", { ref: contentRef, children }),
+    /* @__PURE__ */ jsx3(
+      CadCameraControls,
+      {
+        controlsRef,
+        scheme,
+        freeOrbit,
+        zoomTo
+      }
+    ),
+    showOrbitTarget ? /* @__PURE__ */ jsx3(TargetMarker, { controlsRef }) : null
+  ] }) });
 };
 var Viewer = forwardRef(function Viewer2({
   children,
   className,
   style,
-  projection = "perspective",
+  projection = "orthographic",
   controls = "toolpath",
   freeOrbit = true,
+  zoomTo = "cursor",
+  recentreOnDoubleClick = true,
+  retargetOnDoubleClick = true,
+  showOrbitTarget = false,
   theme,
   onPointerMissed
 }, ref) {
-  const actionsRef = useRef2(null);
-  const resolved = useMemo3(() => resolveTheme(theme), [theme]);
-  const proxy = useMemo3(
+  const actionsRef = useRef3(null);
+  const resolved = useMemo4(() => resolveTheme(theme), [theme]);
+  const proxy = useMemo4(
     () => ({
       fit: () => actionsRef.current?.fit(),
       reset: () => actionsRef.current?.reset(),
@@ -1205,47 +1853,62 @@ var Viewer = forwardRef(function Viewer2({
   const setControls = useCallback((next) => {
     actionsRef.current = next;
   }, []);
-  const tracker = useRef2(null);
+  const tracker = useRef3(null);
   const hold = useCallback((element) => {
     tracker.current?.dispose();
     tracker.current = element ? trackTaps(element) : null;
   }, []);
-  return /* @__PURE__ */ jsx(ViewerControlsContext.Provider, { value: proxy, children: /* @__PURE__ */ jsx("div", { className, ref: hold, style: { height: "100%", width: "100%", ...style }, children: /* @__PURE__ */ jsx(
-    Canvas,
+  return /* @__PURE__ */ jsx3(ViewerControlsContext.Provider, { value: proxy, children: /* @__PURE__ */ jsx3(
+    "div",
     {
-      orthographic: projection === "orthographic",
-      camera: { fov: PERSPECTIVE_FOV, up: [0, 0, 1], position: [1, -1, 1] },
-      dpr: [1, 2],
-      frameloop: "demand",
-      gl: { antialias: true, alpha: true, stencil: true, localClippingEnabled: true },
-      onPointerMissed: (event) => {
-        if (event.button !== 0) return;
-        if (tracker.current?.isTap(event) ?? true) onPointerMissed?.();
+      className,
+      ref: hold,
+      onMouseDown: (event) => {
+        if (event.target instanceof HTMLCanvasElement) event.preventDefault();
       },
-      children: /* @__PURE__ */ jsx(
-        ViewerScene,
+      style: { height: "100%", width: "100%", ...style },
+      children: /* @__PURE__ */ jsx3(
+        Canvas,
         {
-          setControls,
-          projection,
-          scheme: controls,
-          freeOrbit,
-          theme: resolved,
-          children
-        }
+          orthographic: projection === "orthographic",
+          camera: { fov: PERSPECTIVE_FOV, up: [0, 0, 1], position: [1, -1, 1] },
+          dpr: [1, 2],
+          frameloop: "demand",
+          gl: { antialias: true, alpha: true, stencil: true, localClippingEnabled: true },
+          onPointerMissed: (event) => {
+            if (event.button !== 0) return;
+            if (tracker.current?.isTap(event) ?? true) onPointerMissed?.();
+          },
+          children: /* @__PURE__ */ jsx3(
+            ViewerScene,
+            {
+              setControls,
+              projection,
+              scheme: controls,
+              freeOrbit,
+              zoomTo,
+              recentreOnDoubleClick,
+              retargetOnDoubleClick,
+              showOrbitTarget,
+              theme: resolved,
+              children
+            }
+          )
+        },
+        projection
       )
-    },
-    projection
-  ) }) });
+    }
+  ) });
 });
 
 // src/section-view.tsx
-import { useFrame as useFrame3, useThree as useThree4 } from "@react-three/fiber";
-import { useCallback as useCallback2, useMemo as useMemo4, useRef as useRef3, useState } from "react";
+import { useFrame as useFrame4, useThree as useThree5 } from "@react-three/fiber";
+import { useCallback as useCallback2, useMemo as useMemo5, useRef as useRef4, useState } from "react";
 import {
   AlwaysStencilFunc,
   BackSide,
   DecrementWrapStencilOp,
-  DoubleSide,
+  DoubleSide as DoubleSide2,
   FrontSide,
   IncrementWrapStencilOp,
   NotEqualStencilFunc,
@@ -1254,22 +1917,22 @@ import {
   Raycaster as Raycaster2,
   ReplaceStencilOp,
   Vector2 as Vector22,
-  Vector3 as Vector37
+  Vector3 as Vector39
 } from "three";
 
 // src/render/directions.ts
-import { Vector3 as Vector36 } from "three";
-var CONE_AXIS = new Vector36(0, 1, 0);
+import { Vector3 as Vector38 } from "three";
+var CONE_AXIS = new Vector38(0, 1, 0);
 var LENGTH = 0.45;
 var HEAD = 0.45;
 var HEAD_RADIUS = 0.3;
 var SHAFT_RADIUS = 0.09;
 var GAP = 0.2;
 function arrowPlacement(direction, box) {
-  const center = box.getCenter(new Vector36());
-  const half = box.getSize(new Vector36()).multiplyScalar(0.5);
+  const center = box.getCenter(new Vector38());
+  const half = box.getSize(new Vector38()).multiplyScalar(0.5);
   const radius = half.length() || 1;
-  const axis = new Vector36(direction.x, direction.y, direction.z);
+  const axis = new Vector38(direction.x, direction.y, direction.z);
   if (axis.lengthSq() === 0) axis.set(0, 0, 1);
   axis.normalize();
   let exit = Number.POSITIVE_INFINITY;
@@ -1285,13 +1948,13 @@ function arrowPlacement(direction, box) {
 }
 
 // src/section-view.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 var DEFAULT_NORMAL = { x: 0, y: 0, z: 1 };
-var FURNITURE = { [EXCLUDE_FROM_FRAME]: true };
+var FURNITURE2 = { [EXCLUDE_FROM_FRAME]: true };
 function resolveSectionPlane(options, box) {
   if (!options?.enabled || box.isEmpty()) return null;
   const normal = options.plane?.normal ?? options.normal ?? DEFAULT_NORMAL;
-  const axis = new Vector37(normal.x, normal.y, normal.z);
+  const axis = new Vector39(normal.x, normal.y, normal.z);
   if (axis.lengthSq() === 0) axis.set(0, 0, 1);
   axis.normalize();
   const bounds = sectionBounds(box, normal);
@@ -1319,31 +1982,31 @@ var SectionView = ({
   showHandle,
   onDrag
 }) => {
-  const camera = useThree4((state) => state.camera);
-  const size = useThree4((state) => state.size);
-  const invalidate = useThree4((state) => state.invalidate);
-  const controls = useThree4((state) => state.controls);
-  const domElement = useThree4((state) => state.gl.domElement);
-  const capRef = useRef3(null);
-  const handleRef = useRef3(null);
+  const camera = useThree5((state) => state.camera);
+  const size = useThree5((state) => state.size);
+  const invalidate = useThree5((state) => state.invalidate);
+  const controls = useThree5((state) => state.controls);
+  const domElement = useThree5((state) => state.gl.domElement);
+  const capRef = useRef4(null);
+  const handleRef = useRef4(null);
   const [hovered, setHovered] = useState(false);
-  const dragging = useRef3(null);
-  const centre = useMemo4(() => box.getCenter(new Vector37()), [box]);
-  const span = useMemo4(() => box.getSize(new Vector37()).length(), [box]);
-  const clip = useMemo4(() => [plane], [plane]);
-  const capPosition = useMemo4(() => {
+  const dragging = useRef4(null);
+  const centre = useMemo5(() => box.getCenter(new Vector39()), [box]);
+  const span = useMemo5(() => box.getSize(new Vector39()).length(), [box]);
+  const clip = useMemo5(() => [plane], [plane]);
+  const capPosition = useMemo5(() => {
     const point = centre.clone();
     return point.addScaledVector(plane.normal, -(plane.constant + plane.normal.dot(centre)));
   }, [centre, plane]);
-  const capQuaternion = useMemo4(
-    () => new Quaternion2().setFromUnitVectors(new Vector37(0, 0, 1), plane.normal),
+  const capQuaternion = useMemo5(
+    () => new Quaternion2().setFromUnitVectors(new Vector39(0, 0, 1), plane.normal),
     [plane]
   );
-  const handleQuaternion = useMemo4(
+  const handleQuaternion = useMemo5(
     () => new Quaternion2().setFromUnitVectors(CONE_AXIS, plane.normal.clone().negate()),
     [plane]
   );
-  useFrame3(() => {
+  useFrame4(() => {
     const handle = handleRef.current;
     if (!handle) return;
     const length = screenLength(camera, capPosition, size, HANDLE_PIXELS);
@@ -1364,7 +2027,7 @@ var SectionView = ({
     event.stopPropagation();
     const view = camera.position.clone().sub(capPosition).normalize();
     const surface = dragPlane(plane.normal.clone(), view, capPosition);
-    const hit = event.ray.intersectPlane(surface, new Vector37());
+    const hit = event.ray.intersectPlane(surface, new Vector39());
     const start = {
       plane: surface,
       from: hit ? hit.dot(plane.normal) : 0,
@@ -1381,7 +2044,7 @@ var SectionView = ({
         -((native.clientY - rect.top) / rect.height) * 2 + 1
       );
       raycaster.setFromCamera(pointer, camera);
-      const point = raycaster.ray.intersectPlane(start.plane, new Vector37());
+      const point = raycaster.ray.intersectPlane(start.plane, new Vector39());
       if (!point) return;
       onDrag(start.constant - (point.dot(plane.normal) - start.from));
       invalidate();
@@ -1413,8 +2076,8 @@ var SectionView = ({
     // Excluded from framing, all of it. The cap is a quad half again as wide as
     // the part's diagonal, so a Fit that measured it would frame the cut rather
     // than the part and leave the part a speck in the middle of it.
-    /* @__PURE__ */ jsxs2("group", { userData: FURNITURE, children: [
-      /* @__PURE__ */ jsx2("mesh", { geometry, renderOrder: SECTION_RENDER_ORDER.stencil, raycast: () => null, children: /* @__PURE__ */ jsx2(
+    /* @__PURE__ */ jsxs3("group", { userData: FURNITURE2, children: [
+      /* @__PURE__ */ jsx4("mesh", { geometry, renderOrder: SECTION_RENDER_ORDER.stencil, raycast: () => null, children: /* @__PURE__ */ jsx4(
         "meshBasicMaterial",
         {
           side: BackSide,
@@ -1429,7 +2092,7 @@ var SectionView = ({
           clippingPlanes: clip
         }
       ) }),
-      /* @__PURE__ */ jsx2("mesh", { geometry, renderOrder: SECTION_RENDER_ORDER.stencil, raycast: () => null, children: /* @__PURE__ */ jsx2(
+      /* @__PURE__ */ jsx4("mesh", { geometry, renderOrder: SECTION_RENDER_ORDER.stencil, raycast: () => null, children: /* @__PURE__ */ jsx4(
         "meshBasicMaterial",
         {
           side: FrontSide,
@@ -1444,13 +2107,13 @@ var SectionView = ({
           clippingPlanes: clip
         }
       ) }),
-      /* @__PURE__ */ jsx2("group", { ref: capRef, position: capPosition, quaternion: capQuaternion, children: /* @__PURE__ */ jsxs2("mesh", { renderOrder: SECTION_RENDER_ORDER.cap, raycast: () => null, children: [
-        /* @__PURE__ */ jsx2("planeGeometry", { args: [span * 1.5, span * 1.5] }),
-        /* @__PURE__ */ jsx2(
+      /* @__PURE__ */ jsx4("group", { ref: capRef, position: capPosition, quaternion: capQuaternion, children: /* @__PURE__ */ jsxs3("mesh", { renderOrder: SECTION_RENDER_ORDER.cap, raycast: () => null, children: [
+        /* @__PURE__ */ jsx4("planeGeometry", { args: [span * 1.5, span * 1.5] }),
+        /* @__PURE__ */ jsx4(
           "meshBasicMaterial",
           {
             color: theme.sectionCap,
-            side: DoubleSide,
+            side: DoubleSide2,
             stencilWrite: true,
             stencilRef: 0,
             stencilFunc: NotEqualStencilFunc,
@@ -1460,7 +2123,7 @@ var SectionView = ({
           }
         )
       ] }) }),
-      showHandle && onDrag ? /* @__PURE__ */ jsxs2(
+      showHandle && onDrag ? /* @__PURE__ */ jsxs3(
         "group",
         {
           ref: handleRef,
@@ -1468,9 +2131,9 @@ var SectionView = ({
           quaternion: handleQuaternion,
           renderOrder: SECTION_RENDER_ORDER.handle,
           children: [
-            /* @__PURE__ */ jsxs2("mesh", { position: [0, 0.28, 0], ...grab, children: [
-              /* @__PURE__ */ jsx2("coneGeometry", { args: [0.16, 0.34, 20] }),
-              /* @__PURE__ */ jsx2(
+            /* @__PURE__ */ jsxs3("mesh", { position: [0, 0.28, 0], ...grab, children: [
+              /* @__PURE__ */ jsx4("coneGeometry", { args: [0.16, 0.34, 20] }),
+              /* @__PURE__ */ jsx4(
                 "meshBasicMaterial",
                 {
                   color: hovered ? theme.hover : theme.sectionHandle,
@@ -1478,9 +2141,9 @@ var SectionView = ({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs2("mesh", { position: [0, 0.08, 0], ...grab, children: [
-              /* @__PURE__ */ jsx2("cylinderGeometry", { args: [0.045, 0.045, 0.4, 12] }),
-              /* @__PURE__ */ jsx2(
+            /* @__PURE__ */ jsxs3("mesh", { position: [0, 0.08, 0], ...grab, children: [
+              /* @__PURE__ */ jsx4("cylinderGeometry", { args: [0.045, 0.045, 0.4, 12] }),
+              /* @__PURE__ */ jsx4(
                 "meshBasicMaterial",
                 {
                   color: hovered ? theme.hover : theme.sectionHandle,
@@ -1496,14 +2159,14 @@ var SectionView = ({
 };
 
 // src/content-box.ts
-import { useFrame as useFrame4, useThree as useThree5 } from "@react-three/fiber";
-import { useRef as useRef4, useState as useState2 } from "react";
+import { useFrame as useFrame5, useThree as useThree6 } from "@react-three/fiber";
+import { useRef as useRef5, useState as useState2 } from "react";
 import { Box3 as Box34 } from "three";
 function useContentBox() {
-  const scene = useThree5((state) => state.scene);
+  const scene = useThree6((state) => state.scene);
   const [box, setBox] = useState2(() => new Box34());
-  const measured = useRef4(false);
-  useFrame4(() => {
+  const measured = useRef5(false);
+  useFrame5(() => {
     if (measured.current) return;
     const next = new Box34();
     contentBounds(scene, next);
@@ -1515,7 +2178,7 @@ function useContentBox() {
 }
 
 // src/part-mesh.tsx
-import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 var PartMesh = ({
   model,
   geometry,
@@ -1528,22 +2191,23 @@ var PartMesh = ({
   activeDirection = null,
   section,
   onSectionChange,
+  onAdjacency,
   focusFeature = null,
   onHover,
   onPick,
   theme,
   showEdges = true
 }) => {
-  const { camera, controls, invalidate } = useThree6();
+  const { camera, controls, invalidate } = useThree7();
   const viewerControls = useViewerControls();
   const resolved = useStableTheme(theme);
-  const currentTheme = useRef5(resolved);
+  const currentTheme = useRef6(resolved);
   currentTheme.current = resolved;
-  const part = useMemo5(() => createPart(model, geometry, currentTheme.current), [geometry, model]);
-  const hoverRegion = useRef5(null);
+  const part = useMemo6(() => createPart(model, geometry, currentTheme.current), [geometry, model]);
+  const hoverRegion = useRef6(null);
   const box = useContentBox();
-  const cut = useMemo5(() => resolveSectionPlane(section, box), [box, section]);
-  const layers = useRef5({
+  const cut = useMemo6(() => resolveSectionPlane(section, box), [box, section]);
+  const layers = useRef6({
     selection,
     candidates,
     highlights,
@@ -1568,9 +2232,13 @@ var PartMesh = ({
     );
     invalidate();
   }, [invalidate, part]);
-  useEffect4(() => () => part.dispose(), [part]);
-  const framed = useRef5(null);
-  useEffect4(() => {
+  useEffect5(() => () => part.dispose(), [part]);
+  const adjacency = useMemo6(() => regionAdjacency(model, geometry), [model, geometry]);
+  useEffect5(() => {
+    onAdjacency?.(adjacency);
+  }, [adjacency, onAdjacency]);
+  const framed = useRef6(null);
+  useEffect5(() => {
     if (focusFeature === null || focusFeature === framed.current) return;
     framed.current = focusFeature;
     const box2 = part.boxForFeature(focusFeature);
@@ -1588,7 +2256,7 @@ var PartMesh = ({
     part.setClippingPlanes(cut ? [cut.plane] : null);
     invalidate();
   }, [cut, invalidate, part]);
-  const reportedSection = useRef5("");
+  const reportedSection = useRef6("");
   useLayoutEffect(() => {
     const state = cut?.state ?? null;
     const key = state ? `${state.constant}|${state.normal.x},${state.normal.y},${state.normal.z}` : "";
@@ -1608,7 +2276,9 @@ var PartMesh = ({
     repaint();
   }, [layerKey, repaint]);
   const isTap = useTapGuard();
-  const pickFor = (event) => {
+  const retarget = useRetarget();
+  const doubles = useMemo6(() => trackDoubleTaps(), []);
+  const pickFor = (event, doubled = false) => {
     const triangleIndex = event.faceIndex;
     if (triangleIndex == null) return null;
     const region = model.regionIndex.regionForTriangle(triangleIndex);
@@ -1623,6 +2293,7 @@ var PartMesh = ({
       point: [event.point.x, event.point.y, event.point.z],
       normal: [normal.x, normal.y, normal.z],
       activeDirection,
+      doubled,
       viewDirection: viewDirection(camera, target),
       modifiers: {
         alt: source.altKey,
@@ -1653,21 +2324,38 @@ var PartMesh = ({
     },
     [box, cut, onSectionChange, section]
   );
-  return /* @__PURE__ */ jsxs3(Fragment2, { children: [
-    /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsxs4(Fragment, { children: [
+    /* @__PURE__ */ jsx5(
       "primitive",
       {
         object: part.object,
         onPointerMove: (event) => emitHover(pickFor(event)),
-        onPointerOut: () => emitHover(null),
+        onPointerOut: () => {
+          emitHover(null);
+          doubles.reset();
+        },
         onClick: (event) => {
+          if (!isTap(event.nativeEvent)) {
+            doubles.reset();
+            return;
+          }
+          const doubled = doubles.isDouble(event.nativeEvent);
+          const pick = pickFor(event, doubled);
+          if (doubled && retarget) retarget(event.point);
+          if (pick) onPick?.(pick);
+        },
+        onPointerUp: (event) => {
+          if (event.nativeEvent.button !== 2) return;
           if (!isTap(event.nativeEvent)) return;
           const pick = pickFor(event);
           if (pick) onPick?.(pick);
+        },
+        onContextMenu: (event) => {
+          if (pickFor(event)) event.nativeEvent.preventDefault();
         }
       }
     ),
-    cut ? /* @__PURE__ */ jsx3(
+    cut ? /* @__PURE__ */ jsx5(
       SectionView,
       {
         geometry,
@@ -1680,9 +2368,9 @@ var PartMesh = ({
     ) : null
   ] });
 };
-var ORIGIN = new Vector38();
-var UP = new Vector38(0, 0, 1);
-var TARGET = new Vector38();
+var ORIGIN = new Vector310();
+var UP = new Vector310(0, 0, 1);
+var TARGET = new Vector310();
 function readTarget(controls) {
   if (controls && typeof controls.getTarget === "function") {
     return controls.getTarget(TARGET);
@@ -1691,14 +2379,14 @@ function readTarget(controls) {
   return target ?? ORIGIN;
 }
 function useStableTheme(theme) {
-  const held = useRef5(null);
+  const held = useRef6(null);
   const next = resolveTheme(theme);
   if (held.current === null || !themesEqual(held.current, next)) held.current = next;
   return held.current;
 }
 
 // src/engine/geometry.ts
-import { Matrix4 as Matrix42, Mesh as Mesh2 } from "three";
+import { Matrix4 as Matrix42, Mesh as Mesh3 } from "three";
 import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { STLLoader } from "three/examples/jsm/loaders/STLLoader.js";
 var PartMeshError = class extends Error {
@@ -1773,7 +2461,7 @@ function parseStl(data, mesh) {
 function singleMesh(scene) {
   const meshes = [];
   scene.traverse((object) => {
-    if (object instanceof Mesh2) meshes.push(object);
+    if (object instanceof Mesh3) meshes.push(object);
   });
   const [mesh] = meshes;
   if (mesh === void 0 || meshes.length !== 1) {
@@ -1809,7 +2497,7 @@ function assertCounts(geometry, expected) {
 }
 function disposeMaterials(scene) {
   scene.traverse((object) => {
-    if (!(object instanceof Mesh2)) return;
+    if (!(object instanceof Mesh3)) return;
     for (const material of Array.isArray(object.material) ? object.material : [object.material]) {
       material.dispose();
     }
@@ -1817,7 +2505,7 @@ function disposeMaterials(scene) {
 }
 
 // src/engine/normals.ts
-import { Float32BufferAttribute as Float32BufferAttribute3 } from "three";
+import { Float32BufferAttribute as Float32BufferAttribute4 } from "three";
 function smoothRegionNormals(geometry, regions) {
   const position = geometry.getAttribute("position");
   if (!position || geometry.index) return;
@@ -1883,7 +2571,7 @@ function smoothRegionNormals(geometry, regions) {
     normals[vertex * 3 + 1] = y / length;
     normals[vertex * 3 + 2] = z / length;
   }
-  geometry.setAttribute("normal", new Float32BufferAttribute3(normals, 3));
+  geometry.setAttribute("normal", new Float32BufferAttribute4(normals, 3));
 }
 
 // src/engine/geometry-cache.ts
@@ -2250,12 +2938,12 @@ function readDirections(value, issues) {
   }
   const directions = [];
   for (const [i, raw] of value.entries()) {
-    const vec = readVec3(raw);
-    if (vec === null) {
+    const vec2 = readVec3(raw);
+    if (vec2 === null) {
       issues.push(`candidateDirections[${i}] is not a vector`);
       continue;
     }
-    directions.push(vec);
+    directions.push(vec2);
   }
   return directions;
 }
@@ -2306,15 +2994,15 @@ function compareVersions(a, b) {
 }
 
 // src/engine/engine-part.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 var EnginePart = ({ report, ...props }) => {
-  const model = useMemo6(() => normalizePartReport(report), [report]);
+  const model = useMemo7(() => normalizePartReport(report), [report]);
   const resource = useGeometryResource(model);
-  useEffect5(() => {
+  useEffect6(() => {
     engineGeometryCache.retain(resource);
     return () => engineGeometryCache.release(resource);
   }, [resource]);
-  return /* @__PURE__ */ jsx4(PartMesh, { model, geometry: resource.geometry, ...props });
+  return /* @__PURE__ */ jsx6(PartMesh, { model, geometry: resource.geometry, ...props });
 };
 function useGeometryResource(part) {
   const resource = engineGeometryCache.get(part);
@@ -2350,11 +3038,12 @@ export {
   sectionFromPick,
   pickedStartDepth,
   sectionPlane,
-  screenLength,
   dragPlane,
   TAP_SLOP,
   movedFar,
   trackTaps,
+  DOUBLE_TAP_MS,
+  trackDoubleTaps,
   useTapGuard,
   visualSurfaces,
   regionEdgesGeometry,
@@ -2362,6 +3051,7 @@ export {
   buildRegionTexels,
   buildRegionAttribute,
   createPart,
+  regionAdjacency,
   FEATURE_TYPE_RANKS,
   featureTypeRank,
   rankOwners,
@@ -2376,19 +3066,48 @@ export {
   EXCLUDE_FROM_FRAME,
   defaultBounds,
   aspectRatio,
+  screenLength,
   boundsFromBox,
   contentBounds,
   perspectiveFitDistance,
   orthographicHalfHeight,
   fitDistance,
   startPosition,
+  MIN_FRAME_RATIO,
+  MAX_FRAME_RATIO,
+  cameraLimits,
+  targetBoundary,
   applyProjection,
   CAD_CAMERA_UP,
+  adaptedUp,
   cadViewDirections,
   currentViewDirection,
   ExtendedCameraControls,
   CadCameraControls,
+  retargetPose,
+  ORBIT_TARGET_PIXELS,
+  ORBIT_TARGET_RING_PIXELS,
+  ORBIT_TARGET_RING_WIDTH,
+  ORBIT_TARGET_COLOR,
+  ORBIT_TARGET_RING_COLOR,
+  ORBIT_TARGET_RING_OPACITY,
+  ORBIT_TARGET_FLASH_MS,
+  ORBIT_TARGET_FADE_MS,
+  orbitTargetOpacity,
+  VIEW_NAMES,
+  VIEW_SIGNS,
+  viewKind,
+  viewVector,
+  viewUp,
+  squaredUp,
+  CHAMFER,
+  cubeZones,
+  panelGeometry,
+  cubeOutlineGeometry,
+  labelGeometry,
+  labelTexture,
   useViewerControls,
+  useRetarget,
   Viewer,
   CONE_AXIS,
   HEAD,