@tscircuit/3d-viewer 0.0.477 → 0.0.479

package/dist/index.js

@@ -14226,7 +14226,7 @@ var require_browser = __commonJS({
 
 // src/CadViewer.tsx
 import { useState as useState35, useCallback as useCallback21, useRef as useRef26, useEffect as useEffect43 } from "react";
-import * as THREE33 from "three";
+import * as THREE34 from "three";
 
 // src/CadViewerJscad.tsx
 import { su as su12 } from "@tscircuit/circuit-json-util";
@@ -29487,12 +29487,12 @@ var AnyCadComponent = ({
 
 // src/CadViewerContainer.tsx
 import { forwardRef as forwardRef2, useEffect as useEffect16, useMemo as useMemo13, useState as useState9 } from "react";
-import * as THREE15 from "three";
+import * as THREE16 from "three";
 
 // package.json
 var package_default = {
   name: "@tscircuit/3d-viewer",
-  version: "0.0.476",
+  version: "0.0.478",
   main: "./dist/index.js",
   module: "./dist/index.js",
   type: "module",
@@ -29521,6 +29521,7 @@ var package_default = {
   dependencies: {
     "@jscad/regl-renderer": "^2.6.12",
     "@jscad/stl-serializer": "^2.1.20",
+    "circuit-to-canvas": "^0.0.26",
     "react-hot-toast": "^2.6.0",
     three: "^0.165.0",
     "three-stdlib": "^2.36.0",
@@ -29936,6 +29937,7 @@ var Canvas = forwardRef(
 
 // src/react-three/OrbitControls.tsx
 import { useEffect as useEffect11, useMemo as useMemo10 } from "react";
+import * as THREE11 from "three";
 import { OrbitControls as ThreeOrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
 var OrbitControls = ({
   autoRotate,
@@ -29978,6 +29980,14 @@ var OrbitControls = ({
     if (enableDamping !== void 0) controls.enableDamping = enableDamping;
     if (dampingFactor !== void 0) controls.dampingFactor = dampingFactor;
     controls.zoomToCursor = true;
+    controls.mouseButtons = {
+      LEFT: THREE11.MOUSE.ROTATE,
+      // Left click to rotate
+      MIDDLE: THREE11.MOUSE.PAN,
+      // Middle click to pan
+      RIGHT: null
+      // Right-click always disabled - only context menu
+    };
     if (target) {
       controls.target.set(target[0], target[1], target[2]);
       controls.update();
@@ -30014,7 +30024,7 @@ var OrbitControls = ({
 
 // src/react-three/Grid.tsx
 import { useEffect as useEffect12, useMemo as useMemo11 } from "react";
-import * as THREE11 from "three";
+import * as THREE12 from "three";
 var vertexShader = `
   varying vec3 worldPosition;
   void main() {
@@ -30060,24 +30070,24 @@ var Grid = ({
   const { scene, camera } = useThree();
   const size5 = 1e3;
   const gridMesh = useMemo11(() => {
-    const geometry = new THREE11.PlaneGeometry(size5, size5);
+    const geometry = new THREE12.PlaneGeometry(size5, size5);
     geometry.rotateX(-Math.PI / 2);
-    const material = new THREE11.ShaderMaterial({
+    const material = new THREE12.ShaderMaterial({
       vertexShader,
       fragmentShader,
       uniforms: {
         cellSize: { value: cellSize },
         sectionSize: { value: sectionSize },
-        gridColor: { value: new THREE11.Color(15658734) },
-        sectionColor: { value: new THREE11.Color(13421823) },
+        gridColor: { value: new THREE12.Color(15658734) },
+        sectionColor: { value: new THREE12.Color(13421823) },
         fadeDistance: { value: 100 },
         // Fade out based on sectionSize
         fadeStrength: { value: 1.5 }
       },
       transparent: true,
-      side: THREE11.DoubleSide
+      side: THREE12.DoubleSide
     });
-    const mesh = new THREE11.Mesh(geometry, material);
+    const mesh = new THREE12.Mesh(geometry, material);
     if (rotation2) {
       mesh.rotation.fromArray(rotation2);
     }
@@ -30106,15 +30116,15 @@ var Grid = ({
 
 // src/react-three/Lights.tsx
 import { useEffect as useEffect13, useMemo as useMemo12 } from "react";
-import * as THREE12 from "three";
+import * as THREE13 from "three";
 var Lights = () => {
   const { scene } = useThree();
   const ambientLight = useMemo12(
-    () => new THREE12.AmbientLight(16777215, Math.PI / 2),
+    () => new THREE13.AmbientLight(16777215, Math.PI / 2),
     []
   );
   const pointLight = useMemo12(() => {
-    const light = new THREE12.PointLight(16777215, Math.PI / 4);
+    const light = new THREE13.PointLight(16777215, Math.PI / 4);
     light.position.set(-10, -10, 10);
     light.decay = 0;
     return light;
@@ -30133,7 +30143,7 @@ var Lights = () => {
 
 // src/hooks/cameraAnimation.ts
 import { useCallback as useCallback6, useEffect as useEffect14, useRef as useRef5 } from "react";
-import * as THREE13 from "three";
+import * as THREE14 from "three";
 var easeInOutCubic = (t) => t < 0.5 ? 4 * t * t * t : 1 - Math.pow(-2 * t + 2, 3) / 2;
 var CameraAnimatorWithContext = () => {
   const {
@@ -30144,24 +30154,24 @@ var CameraAnimatorWithContext = () => {
     getPresetConfig
   } = useCameraController();
   const animationRef = useRef5(null);
-  const tempQuaternion = useRef5(new THREE13.Quaternion());
-  const tempTarget = useRef5(new THREE13.Vector3());
-  const tempUp = useRef5(new THREE13.Vector3());
-  const tempRoll = useRef5(new THREE13.Quaternion());
-  const tempRollTarget = useRef5(new THREE13.Quaternion());
-  const baseOrientationHelper = useRef5(new THREE13.Object3D());
-  const orientationHelper = useRef5(new THREE13.Object3D());
+  const tempQuaternion = useRef5(new THREE14.Quaternion());
+  const tempTarget = useRef5(new THREE14.Vector3());
+  const tempUp = useRef5(new THREE14.Vector3());
+  const tempRoll = useRef5(new THREE14.Quaternion());
+  const tempRollTarget = useRef5(new THREE14.Quaternion());
+  const baseOrientationHelper = useRef5(new THREE14.Object3D());
+  const orientationHelper = useRef5(new THREE14.Object3D());
   const animateTo = useCallback6(
     ({ position, target, up, durationMs = 600 }) => {
       if (!mainCameraRef.current) return;
       const currentTarget = controlsRef.current?.target ?? defaultTarget;
-      const toPosition = new THREE13.Vector3(
+      const toPosition = new THREE14.Vector3(
         position[0],
         position[1],
         position[2]
       );
-      const resolvedTarget = target ? new THREE13.Vector3(target[0], target[1], target[2]) : defaultTarget.clone();
-      const resolvedUp = new THREE13.Vector3(...up ?? [0, 0, 1]).normalize();
+      const resolvedTarget = target ? new THREE14.Vector3(target[0], target[1], target[2]) : defaultTarget.clone();
+      const resolvedUp = new THREE14.Vector3(...up ?? [0, 0, 1]).normalize();
       const toOrientationHelper = orientationHelper.current;
       toOrientationHelper.position.copy(toPosition);
       toOrientationHelper.up.copy(resolvedUp);
@@ -30318,14 +30328,14 @@ var useCameraSession = () => {
 
 // src/three-components/OrientationCubeCanvas.tsx
 import { useEffect as useEffect15, useRef as useRef7 } from "react";
-import * as THREE14 from "three";
+import * as THREE15 from "three";
 import { Text as TroikaText } from "troika-three-text";
 import { jsx as jsx12 } from "react/jsx-runtime";
 function computePointInFront(rotationVector, distance3) {
-  const quaternion = new THREE14.Quaternion().setFromEuler(
-    new THREE14.Euler(rotationVector.x, rotationVector.y, rotationVector.z)
+  const quaternion = new THREE15.Quaternion().setFromEuler(
+    new THREE15.Euler(rotationVector.x, rotationVector.y, rotationVector.z)
   );
-  const forwardVector = new THREE14.Vector3(0, 0, 1);
+  const forwardVector = new THREE15.Vector3(0, 0, 1);
   forwardVector.applyQuaternion(quaternion);
   const result = forwardVector.multiplyScalar(distance3);
   return result;
@@ -30343,7 +30353,7 @@ var OrientationCubeCanvas = () => {
     const canvas = document.createElement("canvas");
     canvasRef.current = canvas;
     containerRef.current.appendChild(canvas);
-    const renderer = new THREE14.WebGLRenderer({
+    const renderer = new THREE15.WebGLRenderer({
       canvas,
       antialias: true,
       alpha: true
@@ -30351,26 +30361,26 @@ var OrientationCubeCanvas = () => {
     renderer.setSize(120, 120);
     renderer.setPixelRatio(window.devicePixelRatio);
     rendererRef.current = renderer;
-    const scene = new THREE14.Scene();
+    const scene = new THREE15.Scene();
     sceneRef.current = scene;
-    const camera = new THREE14.PerspectiveCamera(75, 1, 0.1, 1e3);
+    const camera = new THREE15.PerspectiveCamera(75, 1, 0.1, 1e3);
     camera.up.set(0, 0, 1);
     cameraRef.current = camera;
-    const ambientLight = new THREE14.AmbientLight(16777215, Math.PI / 2);
+    const ambientLight = new THREE15.AmbientLight(16777215, Math.PI / 2);
     scene.add(ambientLight);
-    const group = new THREE14.Group();
+    const group = new THREE15.Group();
     group.rotation.fromArray([Math.PI / 2, 0, 0]);
     const cubeSize = 1;
-    const box = new THREE14.Mesh(
-      new THREE14.BoxGeometry(cubeSize, cubeSize, cubeSize),
-      new THREE14.MeshStandardMaterial({ color: "white" })
+    const box = new THREE15.Mesh(
+      new THREE15.BoxGeometry(cubeSize, cubeSize, cubeSize),
+      new THREE15.MeshStandardMaterial({ color: "white" })
     );
     group.add(box);
-    const edges = new THREE14.LineSegments(
-      new THREE14.EdgesGeometry(
-        new THREE14.BoxGeometry(cubeSize, cubeSize, cubeSize)
+    const edges = new THREE15.LineSegments(
+      new THREE15.EdgesGeometry(
+        new THREE15.BoxGeometry(cubeSize, cubeSize, cubeSize)
       ),
-      new THREE14.LineBasicMaterial({ color: 0, linewidth: 2 })
+      new THREE15.LineBasicMaterial({ color: 0, linewidth: 2 })
     );
     group.add(edges);
     scene.add(group);
@@ -30424,7 +30434,7 @@ var OrientationCubeCanvas = () => {
     const animate = () => {
       if (mainCameraRef.current) {
         const cameraPosition = computePointInFront(
-          mainCameraRef.current.rotation ?? new THREE14.Euler(0, 0, 0),
+          mainCameraRef.current.rotation ?? new THREE15.Euler(0, 0, 0),
           2
         );
         if (!cameraPosition.equals(camera.position)) {
@@ -30527,7 +30537,7 @@ var CadViewerContainer = forwardRef2(
         Canvas,
         {
           ref,
-          scene: { up: new THREE15.Vector3(0, 0, 1) },
+          scene: { up: new THREE16.Vector3(0, 0, 1) },
           camera: { up: [0, 0, 1], position: initialCameraPosition },
           onCreated: ({ camera }) => {
             mainCameraRef.current = camera;
@@ -32382,7 +32392,7 @@ var Text = ({
 };
 
 // src/three-components/Error3d.tsx
-import * as THREE16 from "three";
+import * as THREE17 from "three";
 import { Fragment as Fragment4, jsx as jsx14, jsxs as jsxs4 } from "react/jsx-runtime";
 var Error3d = ({
   error,
@@ -32416,7 +32426,7 @@ var Error3d = ({
     return [0, 0, 0];
   }, [cad_component2]);
   const group = useMemo17(() => {
-    const g = new THREE16.Group();
+    const g = new THREE17.Group();
     g.position.fromArray(position);
     return g;
   }, [position]);
@@ -32476,9 +32486,9 @@ var Error3d = ({
 };
 var ErrorBox = ({ parent }) => {
   const mesh = useMemo17(() => {
-    const m = new THREE16.Mesh(
-      new THREE16.BoxGeometry(0.5, 0.5, 0.5),
-      new THREE16.MeshStandardMaterial({
+    const m = new THREE17.Mesh(
+      new THREE17.BoxGeometry(0.5, 0.5, 0.5),
+      new THREE17.MeshStandardMaterial({
         depthTest: false,
         transparent: true,
         color: "red",
@@ -32500,7 +32510,7 @@ var ErrorBox = ({ parent }) => {
 
 // src/three-components/STLModel.tsx
 import { useState as useState13, useEffect as useEffect21, useMemo as useMemo18 } from "react";
-import * as THREE17 from "three";
+import * as THREE18 from "three";
 import { STLLoader } from "three-stdlib";
 function STLModel({
   stlUrl,
@@ -32531,12 +32541,12 @@ function STLModel({
   }, [stlUrl, stlData]);
   const mesh = useMemo18(() => {
     if (!geom) return null;
-    const material = new THREE17.MeshStandardMaterial({
-      color: Array.isArray(color) ? new THREE17.Color(color[0], color[1], color[2]) : color,
+    const material = new THREE18.MeshStandardMaterial({
+      color: Array.isArray(color) ? new THREE18.Color(color[0], color[1], color[2]) : color,
       transparent: opacity !== 1,
       opacity
     });
-    return new THREE17.Mesh(geom, material);
+    return new THREE18.Mesh(geom, material);
   }, [geom, color, opacity]);
   useEffect21(() => {
     if (!rootObject || !mesh) return;
@@ -32601,11 +32611,11 @@ var ThreeErrorBoundary = class extends React11.Component {
 
 // src/three-components/JscadBoardTextures.tsx
 import { useEffect as useEffect22, useMemo as useMemo19 } from "react";
-import * as THREE23 from "three";
+import * as THREE24 from "three";
 import { su as su9 } from "@tscircuit/circuit-json-util";
 
 // src/utils/soldermask-texture.ts
-import * as THREE18 from "three";
+import * as THREE19 from "three";
 import { su as su5 } from "@tscircuit/circuit-json-util";
 
 // node_modules/@tscircuit/math-utils/dist/chunk-5N7UJNVK.js
@@ -33150,10 +33160,10 @@ function createSoldermaskTextureForLayer({
     }
   });
   ctx.globalCompositeOperation = "source-over";
-  const texture = new THREE18.CanvasTexture(canvas);
+  const texture = new THREE19.CanvasTexture(canvas);
   texture.generateMipmaps = true;
-  texture.minFilter = THREE18.LinearMipmapLinearFilter;
-  texture.magFilter = THREE18.LinearFilter;
+  texture.minFilter = THREE19.LinearMipmapLinearFilter;
+  texture.magFilter = THREE19.LinearFilter;
   texture.anisotropy = 16;
   texture.needsUpdate = true;
   return texture;
@@ -33161,7 +33171,7 @@ function createSoldermaskTextureForLayer({
 
 // src/utils/silkscreen-texture.ts
 var import_text = __toESM(require_text(), 1);
-import * as THREE19 from "three";
+import * as THREE20 from "three";
 
 // node_modules/transformation-matrix/src/applyToPoint.js
 function applyToPoint(matrix, point2) {
@@ -33820,17 +33830,17 @@ function createSilkscreenTextureForLayer({
       ctx.stroke();
     });
   });
-  const texture = new THREE19.CanvasTexture(canvas);
+  const texture = new THREE20.CanvasTexture(canvas);
   texture.generateMipmaps = true;
-  texture.minFilter = THREE19.LinearMipmapLinearFilter;
-  texture.magFilter = THREE19.LinearFilter;
+  texture.minFilter = THREE20.LinearMipmapLinearFilter;
+  texture.magFilter = THREE20.LinearFilter;
   texture.anisotropy = 16;
   texture.needsUpdate = true;
   return texture;
 }
 
 // src/utils/trace-texture.ts
-import * as THREE20 from "three";
+import * as THREE21 from "three";
 import { su as su7 } from "@tscircuit/circuit-json-util";
 function isWireRoutePoint(point2) {
   return point2 && point2.route_type === "wire" && typeof point2.layer === "string" && typeof point2.width === "number";
@@ -33918,10 +33928,10 @@ function createTraceTextureForLayer({
     }
   });
   ctx.globalCompositeOperation = "source-over";
-  const texture = new THREE20.CanvasTexture(canvas);
+  const texture = new THREE21.CanvasTexture(canvas);
   texture.generateMipmaps = true;
-  texture.minFilter = THREE20.LinearMipmapLinearFilter;
-  texture.magFilter = THREE20.LinearFilter;
+  texture.minFilter = THREE21.LinearMipmapLinearFilter;
+  texture.magFilter = THREE21.LinearFilter;
   texture.anisotropy = 16;
   texture.needsUpdate = true;
   return texture;
@@ -33929,7 +33939,7 @@ function createTraceTextureForLayer({
 
 // src/utils/copper-text-texture.ts
 var import_text2 = __toESM(require_text(), 1);
-import * as THREE21 from "three";
+import * as THREE22 from "three";
 function parseDimension2(value, defaultValue) {
   if (value === void 0) return defaultValue;
   if (typeof value === "number") return value;
@@ -34168,17 +34178,17 @@ function createCopperTextTextureForLayer({
       );
     }
   });
-  const texture = new THREE21.CanvasTexture(canvas);
+  const texture = new THREE22.CanvasTexture(canvas);
   texture.generateMipmaps = true;
-  texture.minFilter = THREE21.LinearMipmapLinearFilter;
-  texture.magFilter = THREE21.LinearFilter;
+  texture.minFilter = THREE22.LinearMipmapLinearFilter;
+  texture.magFilter = THREE22.LinearFilter;
   texture.anisotropy = 16;
   texture.needsUpdate = true;
   return texture;
 }
 
 // src/utils/panel-outline-texture.ts
-import * as THREE22 from "three";
+import * as THREE23 from "three";
 import { su as su8 } from "@tscircuit/circuit-json-util";
 function createPanelOutlineTextureForLayer({
   layer,
@@ -34234,10 +34244,10 @@ function createPanelOutlineTextureForLayer({
       );
     }
   });
-  const texture = new THREE22.CanvasTexture(canvas);
+  const texture = new THREE23.CanvasTexture(canvas);
   texture.generateMipmaps = true;
-  texture.minFilter = THREE22.LinearMipmapLinearFilter;
-  texture.magFilter = THREE22.LinearFilter;
+  texture.minFilter = THREE23.LinearMipmapLinearFilter;
+  texture.magFilter = THREE23.LinearFilter;
   texture.anisotropy = 16;
   texture.needsUpdate = true;
   return texture;
@@ -34357,23 +34367,23 @@ function JscadBoardTextures({
   useEffect22(() => {
     if (!rootObject || !boardData || !textures) return;
     const meshes = [];
-    const createTexturePlane = (texture, zOffset, isBottomLayer, name, usePolygonOffset = false, depthWrite = false) => {
+    const createTexturePlane2 = (texture, zOffset, isBottomLayer, name, usePolygonOffset = false, depthWrite = false) => {
       if (!texture) return null;
       const boardOutlineBounds = calculateOutlineBounds(boardData);
-      const planeGeom = new THREE23.PlaneGeometry(
+      const planeGeom = new THREE24.PlaneGeometry(
         boardOutlineBounds.width,
         boardOutlineBounds.height
       );
-      const material = new THREE23.MeshBasicMaterial({
+      const material = new THREE24.MeshBasicMaterial({
         map: texture,
         transparent: true,
-        side: THREE23.DoubleSide,
+        side: THREE24.DoubleSide,
         depthWrite,
         polygonOffset: usePolygonOffset,
         polygonOffsetFactor: usePolygonOffset ? -1 : 0,
         polygonOffsetUnits: usePolygonOffset ? -1 : 0
       });
-      const mesh = new THREE23.Mesh(planeGeom, material);
+      const mesh = new THREE24.Mesh(planeGeom, material);
       mesh.position.set(
         boardOutlineBounds.centerX,
         boardOutlineBounds.centerY,
@@ -34387,7 +34397,7 @@ function JscadBoardTextures({
     };
     const SURFACE_OFFSET = 1e-3;
     if (visibility.topMask) {
-      const topSoldermaskMesh = createTexturePlane(
+      const topSoldermaskMesh = createTexturePlane2(
         textures.topSoldermask,
         pcbThickness / 2 + SURFACE_OFFSET,
         false,
@@ -34400,7 +34410,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.bottomMask) {
-      const bottomSoldermaskMesh = createTexturePlane(
+      const bottomSoldermaskMesh = createTexturePlane2(
         textures.bottomSoldermask,
         -pcbThickness / 2 - SURFACE_OFFSET,
         true,
@@ -34413,7 +34423,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.topCopper && visibility.topMask) {
-      const topTraceWithMaskMesh = createTexturePlane(
+      const topTraceWithMaskMesh = createTexturePlane2(
         textures.topTraceWithMask,
         pcbThickness / 2 + BOARD_SURFACE_OFFSET.traces + 4e-3,
         false,
@@ -34425,7 +34435,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.bottomCopper && visibility.bottomMask) {
-      const bottomTraceWithMaskMesh = createTexturePlane(
+      const bottomTraceWithMaskMesh = createTexturePlane2(
         textures.bottomTraceWithMask,
         -pcbThickness / 2 - BOARD_SURFACE_OFFSET.traces - 5e-3,
         true,
@@ -34437,7 +34447,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.topSilkscreen) {
-      const topSilkscreenMesh = createTexturePlane(
+      const topSilkscreenMesh = createTexturePlane2(
         textures.topSilkscreen,
         pcbThickness / 2 + SURFACE_OFFSET + 2e-3,
         false,
@@ -34449,7 +34459,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.bottomSilkscreen) {
-      const bottomSilkscreenMesh = createTexturePlane(
+      const bottomSilkscreenMesh = createTexturePlane2(
         textures.bottomSilkscreen,
         -pcbThickness / 2 - SURFACE_OFFSET - 2e-3,
         true,
@@ -34461,7 +34471,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.topCopper) {
-      const topCopperTextMesh = createTexturePlane(
+      const topCopperTextMesh = createTexturePlane2(
         textures.topCopperText,
         pcbThickness / 2 + BOARD_SURFACE_OFFSET.copper,
         false,
@@ -34473,7 +34483,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.bottomCopper) {
-      const bottomCopperTextMesh = createTexturePlane(
+      const bottomCopperTextMesh = createTexturePlane2(
         textures.bottomCopperText,
         -pcbThickness / 2 - BOARD_SURFACE_OFFSET.copper,
         true,
@@ -34485,7 +34495,7 @@ function JscadBoardTextures({
       }
     }
     if (visibility.boardBody) {
-      const topPanelOutlinesMesh = createTexturePlane(
+      const topPanelOutlinesMesh = createTexturePlane2(
         textures.topPanelOutlines,
         pcbThickness / 2 + SURFACE_OFFSET + 3e-3,
         // Above silkscreen
@@ -34498,7 +34508,7 @@ function JscadBoardTextures({
         meshes.push(topPanelOutlinesMesh);
         rootObject.add(topPanelOutlinesMesh);
       }
-      const bottomPanelOutlinesMesh = createTexturePlane(
+      const bottomPanelOutlinesMesh = createTexturePlane2(
         textures.bottomPanelOutlines,
         -pcbThickness / 2 - SURFACE_OFFSET - 3e-3,
         // Below bottom silkscreen
@@ -34518,7 +34528,7 @@ function JscadBoardTextures({
           rootObject.remove(mesh);
         }
         mesh.geometry.dispose();
-        if (mesh.material instanceof THREE23.Material) {
+        if (mesh.material instanceof THREE24.Material) {
           mesh.material.dispose();
         }
       });
@@ -34750,7 +34760,7 @@ import { useEffect as useEffect24, useMemo as useMemo22, useState as useState15
 // src/hooks/useManifoldBoardBuilder.ts
 import { useState as useState14, useEffect as useEffect23, useMemo as useMemo21, useRef as useRef9 } from "react";
 import { su as su18 } from "@tscircuit/circuit-json-util";
-import * as THREE29 from "three";
+import * as THREE31 from "three";
 
 // src/utils/manifold/create-manifold-board.ts
 var arePointsClockwise3 = (points) => {
@@ -34810,202 +34820,6 @@ function createManifoldBoard(Manifold, CrossSection, boardData, pcbThickness, ma
   return { boardOp, outlineCrossSection };
 }
 
-// src/utils/manifold/process-copper-pours.ts
-import * as THREE25 from "three";
-
-// src/utils/manifold-mesh-to-three-geometry.ts
-import * as THREE24 from "three";
-function manifoldMeshToThreeGeometry(manifoldMesh) {
-  const geometry = new THREE24.BufferGeometry();
-  geometry.setAttribute(
-    "position",
-    new THREE24.Float32BufferAttribute(manifoldMesh.vertProperties, 3)
-  );
-  geometry.setIndex(new THREE24.Uint32BufferAttribute(manifoldMesh.triVerts, 1));
-  if (manifoldMesh.runIndex && manifoldMesh.runIndex.length > 1 && manifoldMesh.runOriginalID) {
-    for (let i = 0; i < manifoldMesh.runIndex.length - 1; i++) {
-      const start = manifoldMesh.runIndex[i];
-      const count3 = manifoldMesh.runIndex[i + 1] - start;
-      geometry.addGroup(start, count3, 0);
-    }
-  } else {
-    geometry.addGroup(0, manifoldMesh.triVerts.length, 0);
-  }
-  return geometry;
-}
-
-// src/utils/manifold/process-copper-pours.ts
-var arePointsClockwise4 = (points) => {
-  let area = 0;
-  for (let i = 0; i < points.length; i++) {
-    const j = (i + 1) % points.length;
-    if (points[i] && points[j]) {
-      area += points[i][0] * points[j][1];
-      area -= points[j][0] * points[i][1];
-    }
-  }
-  const signedArea = area / 2;
-  return signedArea <= 0;
-};
-function segmentToPoints2(p1, p2, bulge, arcSegments) {
-  if (!bulge || Math.abs(bulge) < 1e-9) {
-    return [];
-  }
-  const theta = 4 * Math.atan(bulge);
-  const dx = p2[0] - p1[0];
-  const dy = p2[1] - p1[1];
-  const dist = Math.sqrt(dx * dx + dy * dy);
-  if (dist < 1e-9) return [];
-  const radius = Math.abs(dist / (2 * Math.sin(theta / 2)));
-  const m = Math.sqrt(Math.max(0, radius * radius - dist / 2 * (dist / 2)));
-  const midPoint = [(p1[0] + p2[0]) / 2, (p1[1] + p2[1]) / 2];
-  const ux = dx / dist;
-  const uy = dy / dist;
-  const nx = -uy;
-  const ny = ux;
-  const centerX = midPoint[0] + nx * m * Math.sign(bulge);
-  const centerY = midPoint[1] + ny * m * Math.sign(bulge);
-  const startAngle = Math.atan2(p1[1] - centerY, p1[0] - centerX);
-  const points = [];
-  const numSteps = Math.max(
-    2,
-    Math.ceil(arcSegments * Math.abs(theta) / (Math.PI * 2) * 4)
-  );
-  const angleStep = theta / numSteps;
-  for (let i = 1; i < numSteps; i++) {
-    const angle = startAngle + angleStep * i;
-    points.push([
-      centerX + radius * Math.cos(angle),
-      centerY + radius * Math.sin(angle)
-    ]);
-  }
-  return points;
-}
-function ringToPoints2(ring2, arcSegments) {
-  const allPoints = [];
-  const vertices = ring2.vertices;
-  for (let i = 0; i < vertices.length; i++) {
-    const p1 = vertices[i];
-    const p2 = vertices[(i + 1) % vertices.length];
-    allPoints.push([p1.x, p1.y]);
-    if (p1.bulge) {
-      const arcPoints = segmentToPoints2(
-        [p1.x, p1.y],
-        [p2.x, p2.y],
-        p1.bulge,
-        arcSegments
-      );
-      allPoints.push(...arcPoints);
-    }
-  }
-  return allPoints;
-}
-function processCopperPoursForManifold(Manifold, CrossSection, circuitJson, pcbThickness, manifoldInstancesForCleanup, boardMaterial, holeUnion, boardClipVolume) {
-  const copperPourGeoms = [];
-  const copperPours = circuitJson.filter(
-    (e) => e.type === "pcb_copper_pour"
-  );
-  for (const pour of copperPours) {
-    const pourThickness = DEFAULT_SMT_PAD_THICKNESS;
-    const layerSign = pour.layer === "bottom" ? -1 : 1;
-    const zPos = layerSign * (pcbThickness / 2 + pourThickness / 2 + MANIFOLD_Z_OFFSET);
-    let pourOp;
-    if (pour.shape === "rect") {
-      pourOp = Manifold.cube([pour.width, pour.height, pourThickness], true);
-      manifoldInstancesForCleanup.push(pourOp);
-      if (pour.rotation) {
-        const rotatedOp = pourOp.rotate([0, 0, pour.rotation]);
-        manifoldInstancesForCleanup.push(rotatedOp);
-        pourOp = rotatedOp;
-      }
-      pourOp = pourOp.translate([pour.center.x, pour.center.y, zPos]);
-      manifoldInstancesForCleanup.push(pourOp);
-    } else if (pour.shape === "polygon") {
-      if (pour.points.length < 3) continue;
-      let pointsVec2 = pour.points.map((p) => [
-        p.x,
-        p.y
-      ]);
-      if (arePointsClockwise4(pointsVec2)) {
-        pointsVec2 = pointsVec2.reverse();
-      }
-      const crossSection = CrossSection.ofPolygons([pointsVec2]);
-      manifoldInstancesForCleanup.push(crossSection);
-      pourOp = Manifold.extrude(
-        crossSection,
-        pourThickness,
-        0,
-        // nDivisions
-        0,
-        // twistDegrees
-        [1, 1],
-        // scaleTop
-        true
-        // center extrusion
-      ).translate([0, 0, zPos]);
-      manifoldInstancesForCleanup.push(pourOp);
-    } else if (pour.shape === "brep") {
-      const brepShape = pour.brep_shape;
-      if (!brepShape || !brepShape.outer_ring) continue;
-      let outerRingPoints = ringToPoints2(
-        brepShape.outer_ring,
-        SMOOTH_CIRCLE_SEGMENTS
-      );
-      if (arePointsClockwise4(outerRingPoints)) {
-        outerRingPoints = outerRingPoints.reverse();
-      }
-      const polygons = [outerRingPoints];
-      if (brepShape.inner_rings) {
-        const innerRingsPoints = brepShape.inner_rings.map((ring2) => {
-          let points = ringToPoints2(ring2, SMOOTH_CIRCLE_SEGMENTS);
-          if (!arePointsClockwise4(points)) {
-            points = points.reverse();
-          }
-          return points;
-        });
-        polygons.push(...innerRingsPoints);
-      }
-      const crossSection = CrossSection.ofPolygons(polygons);
-      manifoldInstancesForCleanup.push(crossSection);
-      pourOp = Manifold.extrude(
-        crossSection,
-        pourThickness,
-        0,
-        // nDivisions
-        0,
-        // twistDegrees
-        [1, 1],
-        // scaleTop
-        true
-        // center extrusion
-      ).translate([0, 0, zPos]);
-      manifoldInstancesForCleanup.push(pourOp);
-    }
-    if (pourOp) {
-      if (holeUnion) {
-        const withHoles = pourOp.subtract(holeUnion);
-        manifoldInstancesForCleanup.push(withHoles);
-        pourOp = withHoles;
-      }
-      if (boardClipVolume) {
-        const clipped = Manifold.intersection([pourOp, boardClipVolume]);
-        manifoldInstancesForCleanup.push(clipped);
-        pourOp = clipped;
-      }
-      const covered = pour.covered_with_solder_mask !== false;
-      const pourColorArr = covered ? tracesMaterialColors[boardMaterial] ?? colors.fr4TracesWithoutMaskTan : colors.copper;
-      const pourColor = new THREE25.Color(...pourColorArr);
-      const threeGeom = manifoldMeshToThreeGeometry(pourOp.getMesh());
-      copperPourGeoms.push({
-        key: `coppour-${pour.pcb_copper_pour_id}`,
-        geometry: threeGeom,
-        color: pourColor
-      });
-    }
-  }
-  return { copperPourGeoms };
-}
-
 // src/utils/manifold/process-cutouts.ts
 import { su as su13 } from "@tscircuit/circuit-json-util";
 
@@ -35085,7 +34899,7 @@ function createPadManifoldOp({
 }
 
 // src/utils/manifold/process-cutouts.ts
-var arePointsClockwise5 = (points) => {
+var arePointsClockwise4 = (points) => {
   let area = 0;
   for (let i = 0; i < points.length; i++) {
     const j = (i + 1) % points.length;
@@ -35161,7 +34975,7 @@ function processCutoutsForManifold(Manifold, CrossSection, circuitJson, pcbThick
           p.x,
           p.y
         ]);
-        if (arePointsClockwise5(pointsVec2)) {
+        if (arePointsClockwise4(pointsVec2)) {
           pointsVec2 = pointsVec2.reverse();
         }
         const crossSection = CrossSection.ofPolygons([pointsVec2]);
@@ -35297,7 +35111,30 @@ function processNonPlatedHolesForManifold(Manifold, circuitJson, pcbThickness, m
 // src/utils/manifold/process-plated-holes.ts
 import { su as su15 } from "@tscircuit/circuit-json-util";
 import * as THREE26 from "three";
-var arePointsClockwise6 = (points) => {
+
+// src/utils/manifold-mesh-to-three-geometry.ts
+import * as THREE25 from "three";
+function manifoldMeshToThreeGeometry(manifoldMesh) {
+  const geometry = new THREE25.BufferGeometry();
+  geometry.setAttribute(
+    "position",
+    new THREE25.Float32BufferAttribute(manifoldMesh.vertProperties, 3)
+  );
+  geometry.setIndex(new THREE25.Uint32BufferAttribute(manifoldMesh.triVerts, 1));
+  if (manifoldMesh.runIndex && manifoldMesh.runIndex.length > 1 && manifoldMesh.runOriginalID) {
+    for (let i = 0; i < manifoldMesh.runIndex.length - 1; i++) {
+      const start = manifoldMesh.runIndex[i];
+      const count3 = manifoldMesh.runIndex[i + 1] - start;
+      geometry.addGroup(start, count3, 0);
+    }
+  } else {
+    geometry.addGroup(0, manifoldMesh.triVerts.length, 0);
+  }
+  return geometry;
+}
+
+// src/utils/manifold/process-plated-holes.ts
+var arePointsClockwise5 = (points) => {
   let area = 0;
   for (let i = 0; i < points.length; i++) {
     const j = (i + 1) % points.length;
@@ -35344,7 +35181,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       point2.x,
       point2.y
     ]);
-    if (arePointsClockwise6(points)) {
+    if (arePointsClockwise5(points)) {
       points = points.reverse();
     }
     const crossSection = CrossSection.ofPolygons([points]);
@@ -35389,7 +35226,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
       const height10 = Math.max(baseHeight + sizeDelta, M);
       if (holeShape === "oval") {
         let points = createEllipsePoints(width10, height10, SMOOTH_CIRCLE_SEGMENTS);
-        if (arePointsClockwise6(points)) {
+        if (arePointsClockwise5(points)) {
           points = points.reverse();
         }
         const crossSection = CrossSection.ofPolygons([points]);
@@ -35704,7 +35541,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         drillH,
         SMOOTH_CIRCLE_SEGMENTS
       );
-      if (arePointsClockwise6(boardDrillPoints)) {
+      if (arePointsClockwise5(boardDrillPoints)) {
         boardDrillPoints = boardDrillPoints.reverse();
       }
       const boardDrillCrossSection = CrossSection.ofPolygons([boardDrillPoints]);
@@ -35732,7 +35569,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         outerH,
         SMOOTH_CIRCLE_SEGMENTS
       );
-      if (arePointsClockwise6(outerPoints)) {
+      if (arePointsClockwise5(outerPoints)) {
         outerPoints = outerPoints.reverse();
       }
       const outerCrossSection = CrossSection.ofPolygons([outerPoints]);
@@ -35751,7 +35588,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         holeH,
         SMOOTH_CIRCLE_SEGMENTS
       );
-      if (arePointsClockwise6(innerPoints)) {
+      if (arePointsClockwise5(innerPoints)) {
         innerPoints = innerPoints.reverse();
       }
       const innerCrossSection = CrossSection.ofPolygons([innerPoints]);
@@ -36035,6 +35872,397 @@ function processViasForManifold(Manifold, circuitJson, pcbThickness, manifoldIns
   return { viaBoardDrills, viaCopperGeoms };
 }
 
+// src/textures/create-copper-pour-texture-for-layer.ts
+import * as THREE29 from "three";
+import { CircuitToCanvasDrawer } from "circuit-to-canvas";
+function drawPolygon({
+  ctx,
+  points,
+  canvasXFromPcb,
+  canvasYFromPcb
+}) {
+  if (points.length < 3) return;
+  ctx.beginPath();
+  points.forEach((point2, index2) => {
+    const canvasX = canvasXFromPcb(point2[0]);
+    const canvasY = canvasYFromPcb(point2[1]);
+    if (index2 === 0) {
+      ctx.moveTo(canvasX, canvasY);
+    } else {
+      ctx.lineTo(canvasX, canvasY);
+    }
+  });
+  ctx.closePath();
+  ctx.fill();
+}
+function drawBrepShape({
+  ctx,
+  pour,
+  canvasXFromPcb,
+  canvasYFromPcb
+}) {
+  const brepShape = pour.brep_shape;
+  if (!brepShape || !brepShape.outer_ring) return;
+  const outerRingPoints = ringToPoints(brepShape.outer_ring, 32);
+  if (outerRingPoints.length >= 3) {
+    drawPolygon({
+      ctx,
+      points: outerRingPoints,
+      canvasXFromPcb,
+      canvasYFromPcb
+    });
+  }
+  if (brepShape.inner_rings && brepShape.inner_rings.length > 0) {
+    ctx.globalCompositeOperation = "destination-out";
+    for (const innerRing of brepShape.inner_rings) {
+      const innerRingPoints = ringToPoints(innerRing, 32);
+      if (innerRingPoints.length >= 3) {
+        drawPolygon({
+          ctx,
+          points: innerRingPoints,
+          canvasXFromPcb,
+          canvasYFromPcb
+        });
+      }
+    }
+    ctx.globalCompositeOperation = "source-over";
+  }
+}
+function createCopperPourTextureForLayer({
+  layer,
+  circuitJson,
+  boardData,
+  traceTextureResolution = TRACE_TEXTURE_RESOLUTION
+}) {
+  const copperPours = circuitJson.filter(
+    (e) => e.type === "pcb_copper_pour"
+  );
+  const poursOnLayer = copperPours.filter((p) => p.layer === layer);
+  if (poursOnLayer.length === 0) return null;
+  const boardOutlineBounds = calculateOutlineBounds(boardData);
+  const canvas = document.createElement("canvas");
+  const canvasWidth = Math.floor(
+    boardOutlineBounds.width * traceTextureResolution
+  );
+  const canvasHeight = Math.floor(
+    boardOutlineBounds.height * traceTextureResolution
+  );
+  canvas.width = canvasWidth;
+  canvas.height = canvasHeight;
+  const ctx = canvas.getContext("2d");
+  if (!ctx) return null;
+  if (layer === "bottom") {
+    ctx.translate(0, canvasHeight);
+    ctx.scale(1, -1);
+  }
+  const canvasXFromPcb = (pcbX) => (pcbX - boardOutlineBounds.minX) * traceTextureResolution;
+  const canvasYFromPcb = (pcbY) => (boardOutlineBounds.maxY - pcbY) * traceTextureResolution;
+  const rectAndPolygonPours = poursOnLayer.filter(
+    (pour) => pour.shape === "rect" || pour.shape === "polygon"
+  );
+  const brepPours = poursOnLayer.filter((pour) => pour.shape === "brep");
+  if (rectAndPolygonPours.length > 0) {
+    const drawer = new CircuitToCanvasDrawer(ctx);
+    drawer.setCameraBounds({
+      minX: boardOutlineBounds.minX,
+      maxX: boardOutlineBounds.maxX,
+      minY: boardOutlineBounds.minY,
+      maxY: boardOutlineBounds.maxY
+    });
+    const coveredPours = rectAndPolygonPours.filter(
+      (p) => p.covered_with_solder_mask !== false
+    );
+    const uncoveredPours = rectAndPolygonPours.filter(
+      (p) => p.covered_with_solder_mask === false
+    );
+    const coveredColor = `rgb(${colors.fr4TracesWithMaskGreen.map((c) => c * 255).join(",")})`;
+    const uncoveredColor = `rgb(${colors.copper.map((c) => c * 255).join(",")})`;
+    if (coveredPours.length > 0) {
+      drawer.configure({
+        colorOverrides: {
+          copper: {
+            top: coveredColor,
+            bottom: coveredColor,
+            inner1: coveredColor,
+            inner2: coveredColor,
+            inner3: coveredColor,
+            inner4: coveredColor,
+            inner5: coveredColor,
+            inner6: coveredColor
+          }
+        }
+      });
+      drawer.drawElements(coveredPours, { layers: [layer] });
+    }
+    if (uncoveredPours.length > 0) {
+      drawer.configure({
+        colorOverrides: {
+          copper: {
+            top: uncoveredColor,
+            bottom: uncoveredColor,
+            inner1: uncoveredColor,
+            inner2: uncoveredColor,
+            inner3: uncoveredColor,
+            inner4: uncoveredColor,
+            inner5: uncoveredColor,
+            inner6: uncoveredColor
+          }
+        }
+      });
+      drawer.drawElements(uncoveredPours, { layers: [layer] });
+    }
+  }
+  for (const pour of brepPours) {
+    const covered = pour.covered_with_solder_mask !== false;
+    const colorArr = covered ? colors.fr4TracesWithMaskGreen : colors.copper;
+    const copperColor = `rgb(${colorArr[0] * 255}, ${colorArr[1] * 255}, ${colorArr[2] * 255})`;
+    ctx.fillStyle = copperColor;
+    drawBrepShape({ ctx, pour, canvasXFromPcb, canvasYFromPcb });
+  }
+  const texture = new THREE29.CanvasTexture(canvas);
+  texture.generateMipmaps = true;
+  texture.minFilter = THREE29.LinearMipmapLinearFilter;
+  texture.magFilter = THREE29.LinearFilter;
+  texture.anisotropy = 16;
+  texture.needsUpdate = true;
+  return texture;
+}
+
+// src/textures/create-three-texture-meshes.ts
+import * as THREE30 from "three";
+function createTexturePlane(config, boardData) {
+  const {
+    texture,
+    yOffset,
+    isBottomLayer,
+    textureType,
+    usePolygonOffset = false,
+    renderOrder = 0
+  } = config;
+  if (!texture) return null;
+  const boardOutlineBounds = calculateOutlineBounds(boardData);
+  const planeGeom = new THREE30.PlaneGeometry(
+    boardOutlineBounds.width,
+    boardOutlineBounds.height
+  );
+  const material = new THREE30.MeshBasicMaterial({
+    map: texture,
+    transparent: true,
+    side: THREE30.DoubleSide,
+    depthWrite: textureType === "panel-outlines",
+    polygonOffset: usePolygonOffset,
+    polygonOffsetFactor: usePolygonOffset ? -4 : 0,
+    // Increased for better z-fighting prevention
+    polygonOffsetUnits: usePolygonOffset ? -4 : 0
+  });
+  const mesh = new THREE30.Mesh(planeGeom, material);
+  mesh.position.set(
+    boardOutlineBounds.centerX,
+    boardOutlineBounds.centerY,
+    yOffset
+  );
+  if (isBottomLayer) {
+    mesh.rotation.set(Math.PI, 0, 0);
+  }
+  mesh.name = `${isBottomLayer ? "bottom" : "top"}-${textureType}-texture-plane`;
+  mesh.renderOrder = renderOrder;
+  return mesh;
+}
+function createTextureMeshes(textures, boardData, pcbThickness) {
+  const meshes = [];
+  if (!textures || !boardData || pcbThickness === null) return meshes;
+  const topTraceMesh = createTexturePlane(
+    {
+      texture: textures.topTrace,
+      yOffset: pcbThickness / 2 + BOARD_SURFACE_OFFSET.traces,
+      // Use consistent copper offset
+      isBottomLayer: false,
+      textureType: "trace",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (topTraceMesh) meshes.push(topTraceMesh);
+  const topTraceWithMaskMesh = createTexturePlane(
+    {
+      texture: textures.topTraceWithMask,
+      yOffset: pcbThickness / 2 + BOARD_SURFACE_OFFSET.traces,
+      isBottomLayer: false,
+      textureType: "trace-with-mask",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (topTraceWithMaskMesh) meshes.push(topTraceWithMaskMesh);
+  const topSilkscreenMesh = createTexturePlane(
+    {
+      texture: textures.topSilkscreen,
+      yOffset: pcbThickness / 2 + 3e-3,
+      // Slightly above soldermask
+      isBottomLayer: false,
+      textureType: "silkscreen",
+      usePolygonOffset: false,
+      renderOrder: 3
+      // Render after traces
+    },
+    boardData
+  );
+  if (topSilkscreenMesh) meshes.push(topSilkscreenMesh);
+  const bottomTraceMesh = createTexturePlane(
+    {
+      texture: textures.bottomTrace,
+      yOffset: -pcbThickness / 2 - BOARD_SURFACE_OFFSET.traces,
+      // Use consistent copper offset
+      isBottomLayer: true,
+      textureType: "trace",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (bottomTraceMesh) meshes.push(bottomTraceMesh);
+  const bottomTraceWithMaskMesh = createTexturePlane(
+    {
+      texture: textures.bottomTraceWithMask,
+      yOffset: -pcbThickness / 2 - BOARD_SURFACE_OFFSET.traces,
+      isBottomLayer: true,
+      textureType: "trace-with-mask",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (bottomTraceWithMaskMesh) meshes.push(bottomTraceWithMaskMesh);
+  const bottomSilkscreenMesh = createTexturePlane(
+    {
+      texture: textures.bottomSilkscreen,
+      yOffset: -pcbThickness / 2 - 3e-3,
+      isBottomLayer: true,
+      textureType: "silkscreen",
+      usePolygonOffset: false,
+      renderOrder: 3
+      // Render after traces
+    },
+    boardData
+  );
+  if (bottomSilkscreenMesh) meshes.push(bottomSilkscreenMesh);
+  const topSoldermaskMesh = createTexturePlane(
+    {
+      texture: textures.topSoldermask,
+      yOffset: pcbThickness / 2 + 1e-3,
+      // Just above board surface
+      isBottomLayer: false,
+      textureType: "soldermask",
+      usePolygonOffset: true,
+      // Enable polygon offset
+      renderOrder: 1
+      // Render after board (renderOrder)
+    },
+    boardData
+  );
+  if (topSoldermaskMesh) meshes.push(topSoldermaskMesh);
+  const bottomSoldermaskMesh = createTexturePlane(
+    {
+      texture: textures.bottomSoldermask,
+      yOffset: -pcbThickness / 2 - 1e-3,
+      // Just below board surface (bottom side)
+      isBottomLayer: true,
+      textureType: "soldermask",
+      usePolygonOffset: true,
+      // Enable polygon offset
+      renderOrder: 1
+      // Render after board (renderOrder)
+    },
+    boardData
+  );
+  if (bottomSoldermaskMesh) meshes.push(bottomSoldermaskMesh);
+  const topCopperTextMesh = createTexturePlane(
+    {
+      texture: textures.topCopperText,
+      yOffset: pcbThickness / 2 + BOARD_SURFACE_OFFSET.copper,
+      isBottomLayer: false,
+      textureType: "copper-text",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (topCopperTextMesh) meshes.push(topCopperTextMesh);
+  const bottomCopperTextMesh = createTexturePlane(
+    {
+      texture: textures.bottomCopperText,
+      yOffset: -pcbThickness / 2 - BOARD_SURFACE_OFFSET.copper,
+      isBottomLayer: true,
+      textureType: "copper-text",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (bottomCopperTextMesh) meshes.push(bottomCopperTextMesh);
+  const topCopperMesh = createTexturePlane(
+    {
+      texture: textures.topCopper,
+      yOffset: pcbThickness / 2 + BOARD_SURFACE_OFFSET.copper,
+      isBottomLayer: false,
+      textureType: "copper",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (topCopperMesh) meshes.push(topCopperMesh);
+  const bottomCopperMesh = createTexturePlane(
+    {
+      texture: textures.bottomCopper,
+      yOffset: -pcbThickness / 2 - BOARD_SURFACE_OFFSET.copper,
+      isBottomLayer: true,
+      textureType: "copper",
+      usePolygonOffset: false,
+      renderOrder: 2
+      // Render after soldermask
+    },
+    boardData
+  );
+  if (bottomCopperMesh) meshes.push(bottomCopperMesh);
+  const topPanelOutlinesMesh = createTexturePlane(
+    {
+      texture: textures.topPanelOutlines,
+      yOffset: pcbThickness / 2 + 4e-3,
+      // Above silkscreen
+      isBottomLayer: false,
+      textureType: "panel-outlines",
+      usePolygonOffset: false,
+      renderOrder: 4
+    },
+    boardData
+  );
+  if (topPanelOutlinesMesh) meshes.push(topPanelOutlinesMesh);
+  const bottomPanelOutlinesMesh = createTexturePlane(
+    {
+      texture: textures.bottomPanelOutlines,
+      yOffset: -pcbThickness / 2 - 4e-3,
+      // Below bottom silkscreen
+      isBottomLayer: true,
+      textureType: "panel-outlines",
+      usePolygonOffset: false,
+      renderOrder: 4
+    },
+    boardData
+  );
+  if (bottomPanelOutlinesMesh) meshes.push(bottomPanelOutlinesMesh);
+  return meshes;
+}
+
 // src/hooks/useManifoldBoardBuilder.ts
 var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
   const [geoms, setGeoms] = useState14(null);
@@ -36104,7 +36332,7 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
     manifoldInstancesForCleanup.current = [];
     let boardManifold = null;
     const currentGeoms = {};
-    const currentTextures = {};
+    const layerTextureMap = {};
     try {
       const currentPcbThickness = boardData.thickness || 1.6;
       setPcbThickness(currentPcbThickness);
@@ -36203,7 +36431,7 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
             {
               key: "plated-holes-union",
               geometry: cutPlatedGeom,
-              color: new THREE29.Color(
+              color: new THREE31.Color(
                 colors.copper[0],
                 colors.copper[1],
                 colors.copper[2]
@@ -36233,7 +36461,7 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
         const matColorArray = boardMaterialColors[boardData.material] ?? colors.fr4Tan;
         currentGeoms.board = {
           geometry: finalBoardGeom,
-          color: new THREE29.Color(
+          color: new THREE31.Color(
             matColorArray[0],
             matColorArray[1],
             matColorArray[2]
@@ -36251,28 +36479,17 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
         boardClipVolume
       );
       currentGeoms.smtPads = smtPadGeoms;
-      const { copperPourGeoms } = processCopperPoursForManifold(
-        Manifold,
-        CrossSection,
-        circuitJson,
-        currentPcbThickness,
-        manifoldInstancesForCleanup.current,
-        boardData.material,
-        holeUnion,
-        boardClipVolume
-      );
-      currentGeoms.copperPours = copperPourGeoms;
       setGeoms(currentGeoms);
       const traceColorWithoutMaskArr = colors.fr4TracesWithoutMaskTan;
       const traceColorWithoutMask = `rgb(${Math.round(traceColorWithoutMaskArr[0] * 255)}, ${Math.round(traceColorWithoutMaskArr[1] * 255)}, ${Math.round(traceColorWithoutMaskArr[2] * 255)})`;
-      currentTextures.topTrace = createTraceTextureForLayer({
+      layerTextureMap.topTrace = createTraceTextureForLayer({
         layer: "top",
         circuitJson,
         boardData,
         traceColor: traceColorWithoutMask,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.bottomTrace = createTraceTextureForLayer({
+      layerTextureMap.bottomTrace = createTraceTextureForLayer({
         layer: "bottom",
         circuitJson,
         boardData,
@@ -36281,14 +36498,14 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
       });
       const traceColorWithMaskArr = colors.fr4TracesWithMaskGreen;
       const traceColorWithMask = `rgb(${Math.round(traceColorWithMaskArr[0] * 255)}, ${Math.round(traceColorWithMaskArr[1] * 255)}, ${Math.round(traceColorWithMaskArr[2] * 255)})`;
-      currentTextures.topTraceWithMask = createTraceTextureForLayer({
+      layerTextureMap.topTraceWithMask = createTraceTextureForLayer({
         layer: "top",
         circuitJson,
         boardData,
         traceColor: traceColorWithMask,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.bottomTraceWithMask = createTraceTextureForLayer({
+      layerTextureMap.bottomTraceWithMask = createTraceTextureForLayer({
         layer: "bottom",
         circuitJson,
         boardData,
@@ -36296,14 +36513,14 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
       const silkscreenColor = "rgb(255,255,255)";
-      currentTextures.topSilkscreen = createSilkscreenTextureForLayer({
+      layerTextureMap.topSilkscreen = createSilkscreenTextureForLayer({
         layer: "top",
         circuitJson,
         boardData,
         silkscreenColor,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.bottomSilkscreen = createSilkscreenTextureForLayer({
+      layerTextureMap.bottomSilkscreen = createSilkscreenTextureForLayer({
         layer: "bottom",
         circuitJson,
         boardData,
@@ -36312,14 +36529,14 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
       });
       const soldermaskColorArr = soldermaskColors[boardData.material] ?? colors.fr4SolderMaskGreen;
       const soldermaskColor = `rgb(${Math.round(soldermaskColorArr[0] * 255)}, ${Math.round(soldermaskColorArr[1] * 255)}, ${Math.round(soldermaskColorArr[2] * 255)})`;
-      currentTextures.topSoldermask = createSoldermaskTextureForLayer({
+      layerTextureMap.topSoldermask = createSoldermaskTextureForLayer({
         layer: "top",
         circuitJson,
         boardData,
         soldermaskColor,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.bottomSoldermask = createSoldermaskTextureForLayer({
+      layerTextureMap.bottomSoldermask = createSoldermaskTextureForLayer({
         layer: "bottom",
         circuitJson,
         boardData,
@@ -36328,33 +36545,45 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
       });
       const copperColorArr = colors.copper;
       const copperColor = `rgb(${Math.round(copperColorArr[0] * 255)}, ${Math.round(copperColorArr[1] * 255)}, ${Math.round(copperColorArr[2] * 255)})`;
-      currentTextures.topCopperText = createCopperTextTextureForLayer({
+      layerTextureMap.topCopperText = createCopperTextTextureForLayer({
         layer: "top",
         circuitJson,
         boardData,
         copperColor,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.bottomCopperText = createCopperTextTextureForLayer({
+      layerTextureMap.bottomCopperText = createCopperTextTextureForLayer({
         layer: "bottom",
         circuitJson,
         boardData,
         copperColor,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.topPanelOutlines = createPanelOutlineTextureForLayer({
+      layerTextureMap.topPanelOutlines = createPanelOutlineTextureForLayer({
         layer: "top",
         circuitJson,
         panelData: boardData,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      currentTextures.bottomPanelOutlines = createPanelOutlineTextureForLayer({
+      layerTextureMap.bottomPanelOutlines = createPanelOutlineTextureForLayer({
         layer: "bottom",
         circuitJson,
         panelData: boardData,
         traceTextureResolution: TRACE_TEXTURE_RESOLUTION
       });
-      setTextures(currentTextures);
+      layerTextureMap.topCopper = createCopperPourTextureForLayer({
+        layer: "top",
+        circuitJson,
+        boardData,
+        traceTextureResolution: TRACE_TEXTURE_RESOLUTION
+      });
+      layerTextureMap.bottomCopper = createCopperPourTextureForLayer({
+        layer: "bottom",
+        circuitJson,
+        boardData,
+        traceTextureResolution: TRACE_TEXTURE_RESOLUTION
+      });
+      setTextures(layerTextureMap);
     } catch (e) {
       console.error("Error processing geometry with Manifold in hook:", e);
       setError(
@@ -36382,11 +36611,11 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
 };
 
 // src/utils/manifold/create-three-geometry-meshes.ts
-import * as THREE31 from "three";
+import * as THREE33 from "three";
 
 // src/utils/create-board-material.ts
-import * as THREE30 from "three";
-var DEFAULT_SIDE = THREE30.DoubleSide;
+import * as THREE32 from "three";
+var DEFAULT_SIDE = THREE32.DoubleSide;
 var createBoardMaterial = ({
   material,
   color,
@@ -36394,7 +36623,7 @@ var createBoardMaterial = ({
   isFaux = false
 }) => {
   if (material === "fr4") {
-    return new THREE30.MeshPhysicalMaterial({
+    return new THREE32.MeshPhysicalMaterial({
       color,
       side,
       metalness: 0,
@@ -36408,7 +36637,7 @@ var createBoardMaterial = ({
       flatShading: true
     });
   }
-  return new THREE30.MeshStandardMaterial({
+  return new THREE32.MeshStandardMaterial({
     color,
     side,
     flatShading: true,
@@ -36424,12 +36653,12 @@ function createGeometryMeshes(geoms) {
   const meshes = [];
   if (!geoms) return meshes;
   if (geoms.board && geoms.board.geometry) {
-    const mesh = new THREE31.Mesh(
+    const mesh = new THREE33.Mesh(
       geoms.board.geometry,
       createBoardMaterial({
         material: geoms.board.material,
         color: geoms.board.color,
-        side: THREE31.DoubleSide,
+        side: THREE33.DoubleSide,
         isFaux: geoms.board.isFaux
       })
     );
@@ -36439,11 +36668,11 @@ function createGeometryMeshes(geoms) {
   const createMeshesFromArray = (geomArray) => {
     if (geomArray) {
       geomArray.forEach((comp) => {
-        const mesh = new THREE31.Mesh(
+        const mesh = new THREE33.Mesh(
           comp.geometry,
-          new THREE31.MeshStandardMaterial({
+          new THREE33.MeshStandardMaterial({
             color: comp.color,
-            side: THREE31.DoubleSide,
+            side: THREE33.DoubleSide,
             flatShading: true,
             // Consistent with board
             polygonOffset: true,
@@ -36459,172 +36688,6 @@ function createGeometryMeshes(geoms) {
   createMeshesFromArray(geoms.platedHoles);
   createMeshesFromArray(geoms.smtPads);
   createMeshesFromArray(geoms.vias);
-  createMeshesFromArray(geoms.copperPours);
-  return meshes;
-}
-
-// src/utils/manifold/create-three-texture-meshes.ts
-import * as THREE32 from "three";
-function createTextureMeshes(textures, boardData, pcbThickness) {
-  const meshes = [];
-  if (!textures || !boardData || pcbThickness === null) return meshes;
-  const createTexturePlane = (texture, yOffset, isBottomLayer, keySuffix, usePolygonOffset = false, renderOrder = 0) => {
-    if (!texture) return null;
-    const boardOutlineBounds = calculateOutlineBounds(boardData);
-    const planeGeom = new THREE32.PlaneGeometry(
-      boardOutlineBounds.width,
-      boardOutlineBounds.height
-    );
-    const material = new THREE32.MeshBasicMaterial({
-      map: texture,
-      transparent: true,
-      side: THREE32.DoubleSide,
-      depthWrite: keySuffix === "panel-outlines",
-      polygonOffset: usePolygonOffset,
-      polygonOffsetFactor: usePolygonOffset ? -4 : 0,
-      // Increased for better z-fighting prevention
-      polygonOffsetUnits: usePolygonOffset ? -4 : 0
-    });
-    const mesh = new THREE32.Mesh(planeGeom, material);
-    mesh.position.set(
-      boardOutlineBounds.centerX,
-      boardOutlineBounds.centerY,
-      yOffset
-    );
-    if (isBottomLayer) {
-      mesh.rotation.set(Math.PI, 0, 0);
-    }
-    mesh.name = `${isBottomLayer ? "bottom" : "top"}-${keySuffix}-texture-plane`;
-    mesh.renderOrder = renderOrder;
-    return mesh;
-  };
-  const topTraceMesh = createTexturePlane(
-    textures.topTrace,
-    pcbThickness / 2 + BOARD_SURFACE_OFFSET.traces,
-    // Use consistent copper offset
-    false,
-    "trace",
-    false,
-    2
-    // Render after soldermask
-  );
-  if (topTraceMesh) meshes.push(topTraceMesh);
-  const topTraceWithMaskMesh = createTexturePlane(
-    textures.topTraceWithMask,
-    pcbThickness / 2 + BOARD_SURFACE_OFFSET.traces,
-    false,
-    "trace-with-mask",
-    false,
-    2
-    // Render after soldermask
-  );
-  if (topTraceWithMaskMesh) meshes.push(topTraceWithMaskMesh);
-  const topSilkscreenMesh = createTexturePlane(
-    textures.topSilkscreen,
-    pcbThickness / 2 + 3e-3,
-    // Slightly above soldermask
-    false,
-    "silkscreen",
-    false,
-    3
-    // Render after traces
-  );
-  if (topSilkscreenMesh) meshes.push(topSilkscreenMesh);
-  const bottomTraceMesh = createTexturePlane(
-    textures.bottomTrace,
-    -pcbThickness / 2 - BOARD_SURFACE_OFFSET.traces,
-    // Use consistent copper offset
-    true,
-    "trace",
-    false,
-    2
-    // Render after soldermask
-  );
-  if (bottomTraceMesh) meshes.push(bottomTraceMesh);
-  const bottomTraceWithMaskMesh = createTexturePlane(
-    textures.bottomTraceWithMask,
-    -pcbThickness / 2 - BOARD_SURFACE_OFFSET.traces,
-    true,
-    "trace-with-mask",
-    false,
-    2
-    // Render after soldermask
-  );
-  if (bottomTraceWithMaskMesh) meshes.push(bottomTraceWithMaskMesh);
-  const bottomSilkscreenMesh = createTexturePlane(
-    textures.bottomSilkscreen,
-    -pcbThickness / 2 - 3e-3,
-    true,
-    "silkscreen",
-    false,
-    3
-    // Render after traces
-  );
-  if (bottomSilkscreenMesh) meshes.push(bottomSilkscreenMesh);
-  const topSoldermaskMesh = createTexturePlane(
-    textures.topSoldermask,
-    pcbThickness / 2 + 1e-3,
-    // Just above board surface
-    false,
-    "soldermask",
-    true,
-    // Enable polygon offset
-    1
-    // Render after board (renderOrder)
-  );
-  if (topSoldermaskMesh) meshes.push(topSoldermaskMesh);
-  const bottomSoldermaskMesh = createTexturePlane(
-    textures.bottomSoldermask,
-    -pcbThickness / 2 - 1e-3,
-    // Just below board surface (bottom side)
-    true,
-    "soldermask",
-    true,
-    // Enable polygon offset
-    1
-    // Render after board (renderOrder)
-  );
-  if (bottomSoldermaskMesh) meshes.push(bottomSoldermaskMesh);
-  const topCopperTextMesh = createTexturePlane(
-    textures.topCopperText,
-    pcbThickness / 2 + BOARD_SURFACE_OFFSET.copper,
-    false,
-    "copper-text",
-    false,
-    2
-    // Render after soldermask
-  );
-  if (topCopperTextMesh) meshes.push(topCopperTextMesh);
-  const bottomCopperTextMesh = createTexturePlane(
-    textures.bottomCopperText,
-    -pcbThickness / 2 - BOARD_SURFACE_OFFSET.copper,
-    true,
-    "copper-text",
-    false,
-    2
-    // Render after soldermask
-  );
-  if (bottomCopperTextMesh) meshes.push(bottomCopperTextMesh);
-  const topPanelOutlinesMesh = createTexturePlane(
-    textures.topPanelOutlines,
-    pcbThickness / 2 + 4e-3,
-    // Above silkscreen
-    false,
-    "panel-outlines",
-    false,
-    4
-  );
-  if (topPanelOutlinesMesh) meshes.push(topPanelOutlinesMesh);
-  const bottomPanelOutlinesMesh = createTexturePlane(
-    textures.bottomPanelOutlines,
-    -pcbThickness / 2 - 4e-3,
-    // Below bottom silkscreen
-    true,
-    "panel-outlines",
-    false,
-    4
-  );
-  if (bottomPanelOutlinesMesh) meshes.push(bottomPanelOutlinesMesh);
   return meshes;
 }
 
@@ -36652,8 +36715,6 @@ var BoardMeshes = ({
         }
       } else if (mesh.name.includes("plated_hole") || mesh.name.includes("via")) {
         shouldShow = visibility.topCopper || visibility.bottomCopper;
-      } else if (mesh.name.includes("copper_pour")) {
-        shouldShow = visibility.topCopper || visibility.bottomCopper;
       }
       if (shouldShow) {
         rootObject.add(mesh);
@@ -36681,6 +36742,10 @@ var BoardMeshes = ({
         shouldShow = visibility.topCopper;
       } else if (mesh.name.includes("bottom-copper-text")) {
         shouldShow = visibility.bottomCopper;
+      } else if (mesh.name.includes("top-copper")) {
+        shouldShow = visibility.topCopper;
+      } else if (mesh.name.includes("bottom-copper")) {
+        shouldShow = visibility.bottomCopper;
       } else if (mesh.name.includes("panel-outlines")) {
         shouldShow = visibility.boardBody;
       }
@@ -43536,7 +43601,7 @@ var KeyboardShortcutsDialog = ({
 
 // src/CadViewer.tsx
 import { jsx as jsx37, jsxs as jsxs11 } from "react/jsx-runtime";
-var DEFAULT_TARGET = new THREE33.Vector3(0, 0, 0);
+var DEFAULT_TARGET = new THREE34.Vector3(0, 0, 0);
 var INITIAL_CAMERA_POSITION = [5, -5, 5];
 var CadViewerInner = (props) => {
   const [engine, setEngine] = useState35("manifold");
@@ -43803,11 +43868,11 @@ var CadViewer = (props) => {
 // src/convert-circuit-json-to-3d-svg.ts
 var import_debug = __toESM(require_browser(), 1);
 import { su as su20 } from "@tscircuit/circuit-json-util";
-import * as THREE37 from "three";
+import * as THREE38 from "three";
 import { SVGRenderer } from "three/examples/jsm/renderers/SVGRenderer.js";
 
 // src/utils/create-geometry-from-polygons.ts
-import * as THREE34 from "three";
+import * as THREE35 from "three";
 import { BufferGeometry as BufferGeometry3, Float32BufferAttribute as Float32BufferAttribute2 } from "three";
 function createGeometryFromPolygons(polygons) {
   const geometry = new BufferGeometry3();
@@ -43821,12 +43886,12 @@ function createGeometryFromPolygons(polygons) {
         ...polygon3.vertices[i + 1]
         // Third vertex
       );
-      const v1 = new THREE34.Vector3(...polygon3.vertices[0]);
-      const v2 = new THREE34.Vector3(...polygon3.vertices[i]);
-      const v3 = new THREE34.Vector3(...polygon3.vertices[i + 1]);
-      const normal = new THREE34.Vector3().crossVectors(
-        new THREE34.Vector3().subVectors(v2, v1),
-        new THREE34.Vector3().subVectors(v3, v1)
+      const v1 = new THREE35.Vector3(...polygon3.vertices[0]);
+      const v2 = new THREE35.Vector3(...polygon3.vertices[i]);
+      const v3 = new THREE35.Vector3(...polygon3.vertices[i + 1]);
+      const normal = new THREE35.Vector3().crossVectors(
+        new THREE35.Vector3().subVectors(v2, v1),
+        new THREE35.Vector3().subVectors(v3, v1)
       ).normalize();
       normals.push(
         normal.x,
@@ -43850,10 +43915,10 @@ function createGeometryFromPolygons(polygons) {
 var import_modeling2 = __toESM(require_src(), 1);
 var import_jscad_planner2 = __toESM(require_dist(), 1);
 var jscadModeling2 = __toESM(require_src(), 1);
-import * as THREE36 from "three";
+import * as THREE37 from "three";
 
 // src/utils/load-model.ts
-import * as THREE35 from "three";
+import * as THREE36 from "three";
 import { GLTFLoader as GLTFLoader2 } from "three/examples/jsm/loaders/GLTFLoader.js";
 import { OBJLoader as OBJLoader2 } from "three/examples/jsm/loaders/OBJLoader.js";
 import { STLLoader as STLLoader2 } from "three/examples/jsm/loaders/STLLoader.js";
@@ -43861,12 +43926,12 @@ async function load3DModel(url) {
   if (url.endsWith(".stl")) {
     const loader = new STLLoader2();
     const geometry = await loader.loadAsync(url);
-    const material = new THREE35.MeshStandardMaterial({
+    const material = new THREE36.MeshStandardMaterial({
       color: 8947848,
       metalness: 0.5,
       roughness: 0.5
     });
-    return new THREE35.Mesh(geometry, material);
+    return new THREE36.Mesh(geometry, material);
   }
   if (url.endsWith(".obj")) {
     const loader = new OBJLoader2();
@@ -43899,9 +43964,9 @@ async function renderComponent(component, scene) {
       }
       if (component.rotation) {
         model.rotation.set(
-          THREE36.MathUtils.degToRad(component.rotation.x ?? 0),
-          THREE36.MathUtils.degToRad(component.rotation.y ?? 0),
-          THREE36.MathUtils.degToRad(component.rotation.z ?? 0)
+          THREE37.MathUtils.degToRad(component.rotation.x ?? 0),
+          THREE37.MathUtils.degToRad(component.rotation.y ?? 0),
+          THREE37.MathUtils.degToRad(component.rotation.z ?? 0)
         );
       }
       scene.add(model);
@@ -43915,13 +43980,13 @@ async function renderComponent(component, scene) {
     );
     if (jscadObject && (jscadObject.polygons || jscadObject.sides)) {
       const threeGeom = convertCSGToThreeGeom(jscadObject);
-      const material2 = new THREE36.MeshStandardMaterial({
+      const material2 = new THREE37.MeshStandardMaterial({
         color: 8947848,
         metalness: 0.5,
         roughness: 0.5,
-        side: THREE36.DoubleSide
+        side: THREE37.DoubleSide
       });
-      const mesh2 = new THREE36.Mesh(threeGeom, material2);
+      const mesh2 = new THREE37.Mesh(threeGeom, material2);
       if (component.position) {
         mesh2.position.set(
           component.position.x ?? 0,
@@ -43931,9 +43996,9 @@ async function renderComponent(component, scene) {
       }
       if (component.rotation) {
         mesh2.rotation.set(
-          THREE36.MathUtils.degToRad(component.rotation.x ?? 0),
-          THREE36.MathUtils.degToRad(component.rotation.y ?? 0),
-          THREE36.MathUtils.degToRad(component.rotation.z ?? 0)
+          THREE37.MathUtils.degToRad(component.rotation.x ?? 0),
+          THREE37.MathUtils.degToRad(component.rotation.y ?? 0),
+          THREE37.MathUtils.degToRad(component.rotation.z ?? 0)
         );
       }
       scene.add(mesh2);
@@ -43950,17 +44015,17 @@ async function renderComponent(component, scene) {
       if (!geom || !geom.polygons && !geom.sides) {
         continue;
       }
-      const color = new THREE36.Color(geomInfo.color);
+      const color = new THREE37.Color(geomInfo.color);
       color.convertLinearToSRGB();
       const geomWithColor = { ...geom, color: [color.r, color.g, color.b] };
       const threeGeom = convertCSGToThreeGeom(geomWithColor);
-      const material2 = new THREE36.MeshStandardMaterial({
+      const material2 = new THREE37.MeshStandardMaterial({
         vertexColors: true,
         metalness: 0.2,
         roughness: 0.8,
-        side: THREE36.DoubleSide
+        side: THREE37.DoubleSide
       });
-      const mesh2 = new THREE36.Mesh(threeGeom, material2);
+      const mesh2 = new THREE37.Mesh(threeGeom, material2);
       if (component.position) {
         mesh2.position.set(
           component.position.x ?? 0,
@@ -43970,22 +44035,22 @@ async function renderComponent(component, scene) {
       }
       if (component.rotation) {
         mesh2.rotation.set(
-          THREE36.MathUtils.degToRad(component.rotation.x ?? 0),
-          THREE36.MathUtils.degToRad(component.rotation.y ?? 0),
-          THREE36.MathUtils.degToRad(component.rotation.z ?? 0)
+          THREE37.MathUtils.degToRad(component.rotation.x ?? 0),
+          THREE37.MathUtils.degToRad(component.rotation.y ?? 0),
+          THREE37.MathUtils.degToRad(component.rotation.z ?? 0)
         );
       }
       scene.add(mesh2);
     }
     return;
   }
-  const geometry = new THREE36.BoxGeometry(0.5, 0.5, 0.5);
-  const material = new THREE36.MeshStandardMaterial({
+  const geometry = new THREE37.BoxGeometry(0.5, 0.5, 0.5);
+  const material = new THREE37.MeshStandardMaterial({
     color: 16711680,
     transparent: true,
     opacity: 0.25
   });
-  const mesh = new THREE36.Mesh(geometry, material);
+  const mesh = new THREE37.Mesh(geometry, material);
   if (component.position) {
     mesh.position.set(
       component.position.x ?? 0,
@@ -44006,11 +44071,11 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
     padding = 20,
     zoom = 1.5
   } = options;
-  const scene = new THREE37.Scene();
+  const scene = new THREE38.Scene();
   const renderer = new SVGRenderer();
   renderer.setSize(width10, height10);
-  renderer.setClearColor(new THREE37.Color(backgroundColor), 1);
-  const camera = new THREE37.OrthographicCamera();
+  renderer.setClearColor(new THREE38.Color(backgroundColor), 1);
+  const camera = new THREE38.OrthographicCamera();
   const aspect = width10 / height10;
   const frustumSize = 100;
   const halfFrustumSize = frustumSize / 2 / zoom;
@@ -44024,11 +44089,11 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
   camera.position.set(position.x, position.y, position.z);
   camera.up.set(0, 1, 0);
   const lookAt = options.camera?.lookAt ?? { x: 0, y: 0, z: 0 };
-  camera.lookAt(new THREE37.Vector3(lookAt.x, lookAt.y, lookAt.z));
+  camera.lookAt(new THREE38.Vector3(lookAt.x, lookAt.y, lookAt.z));
   camera.updateProjectionMatrix();
-  const ambientLight = new THREE37.AmbientLight(16777215, Math.PI / 2);
+  const ambientLight = new THREE38.AmbientLight(16777215, Math.PI / 2);
   scene.add(ambientLight);
-  const pointLight = new THREE37.PointLight(16777215, Math.PI / 4);
+  const pointLight = new THREE38.PointLight(16777215, Math.PI / 4);
   pointLight.position.set(-10, -10, 10);
   scene.add(pointLight);
   const components = su20(circuitJson).cad_component.list();
@@ -44039,7 +44104,7 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
   const boardGeom = createBoardGeomFromCircuitJson(circuitJson);
   if (boardGeom) {
     const solderMaskColor = colors.fr4SolderMaskGreen;
-    const baseColor = new THREE37.Color(
+    const baseColor = new THREE38.Color(
       solderMaskColor[0],
       solderMaskColor[1],
       solderMaskColor[2]
@@ -44051,28 +44116,28 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
       const material = createBoardMaterial({
         material: boardData?.material,
         color: baseColor,
-        side: THREE37.DoubleSide
+        side: THREE38.DoubleSide
       });
-      const mesh = new THREE37.Mesh(geometry, material);
+      const mesh = new THREE38.Mesh(geometry, material);
       scene.add(mesh);
     }
   }
-  const gridColor = new THREE37.Color(8947848);
-  const gridHelper = new THREE37.GridHelper(100, 100, gridColor, gridColor);
+  const gridColor = new THREE38.Color(8947848);
+  const gridHelper = new THREE38.GridHelper(100, 100, gridColor, gridColor);
   gridHelper.rotation.x = Math.PI / 2;
   const materials = Array.isArray(gridHelper.material) ? gridHelper.material : [gridHelper.material];
   for (const mat of materials) {
     mat.transparent = true;
     mat.opacity = 0.3;
-    if (mat instanceof THREE37.LineBasicMaterial) {
+    if (mat instanceof THREE38.LineBasicMaterial) {
       mat.color = gridColor;
       mat.vertexColors = false;
     }
   }
   scene.add(gridHelper);
-  const box = new THREE37.Box3().setFromObject(scene);
-  const center = box.getCenter(new THREE37.Vector3());
-  const size5 = box.getSize(new THREE37.Vector3());
+  const box = new THREE38.Box3().setFromObject(scene);
+  const center = box.getCenter(new THREE38.Vector3());
+  const size5 = box.getSize(new THREE38.Vector3());
   scene.position.sub(center);
   const maxDim = Math.max(size5.x, size5.y, size5.z);
   if (maxDim > 0) {