@tscircuit/3d-viewer 0.0.432 → 0.0.434

package/dist/index.d.ts

@@ -48,6 +48,7 @@ interface ManifoldGeoms {
         geometry: THREE.BufferGeometry;
         color: THREE.Color;
         material: PcbBoard["material"];
+        isFaux?: boolean;
     };
     platedHoles?: Array<{
         key: string;
@@ -83,6 +84,7 @@ interface UseManifoldBoardBuilderResult {
     error: string | null;
     isLoading: boolean;
     boardData: PcbBoard | null;
+    isFauxBoard: boolean;
 }
 declare const useManifoldBoardBuilder: (manifoldJSModule: ManifoldToplevel | null, circuitJson: AnyCircuitElement[]) => UseManifoldBoardBuilderResult;
 

package/dist/index.js

@@ -14231,7 +14231,7 @@ var require_browser = __commonJS({
 import { useState as useState33, useCallback as useCallback20, useRef as useRef23, useEffect as useEffect39 } from "react";
 
 // src/CadViewerJscad.tsx
-import { su as su4 } from "@tscircuit/circuit-json-util";
+import { su as su6 } from "@tscircuit/circuit-json-util";
 import { forwardRef as forwardRef3, useMemo as useMemo19 } from "react";
 
 // src/AnyCadComponent.tsx
@@ -28174,7 +28174,7 @@ import * as THREE14 from "three";
 // package.json
 var package_default = {
   name: "@tscircuit/3d-viewer",
-  version: "0.0.431",
+  version: "0.0.433",
   main: "./dist/index.js",
   module: "./dist/index.js",
   type: "module",
@@ -31449,6 +31449,93 @@ var ThreeErrorBoundary = class extends React11.Component {
   }
 };
 
+// src/utils/preprocess-circuit-json.ts
+import { su as su5 } from "@tscircuit/circuit-json-util";
+
+// src/utils/create-faux-board.ts
+import { su as su4, getBoundsOfPcbElements } from "@tscircuit/circuit-json-util";
+function createFauxBoard(circuitJson) {
+  const cadComponents = su4(circuitJson).cad_component.list();
+  const pads = su4(circuitJson).pcb_smtpad.list();
+  const holes = su4(circuitJson).pcb_hole.list();
+  const platedHoles = su4(circuitJson).pcb_plated_hole.list();
+  const vias = su4(circuitJson).pcb_via.list();
+  if (cadComponents.length === 0 && pads.length === 0 && holes.length === 0 && platedHoles.length === 0 && vias.length === 0) {
+    return null;
+  }
+  const pcbElements = [...holes, ...platedHoles, ...vias, ...pads];
+  const bounds = getBoundsOfPcbElements(pcbElements);
+  let minX = bounds.minX;
+  let maxX = bounds.maxX;
+  let minY = bounds.minY;
+  let maxY = bounds.maxY;
+  for (const component of cadComponents) {
+    if (component.position) {
+      const x = component.position.x;
+      const y = component.position.y;
+      minX = Math.min(minX, x);
+      maxX = Math.max(maxX, x);
+      minY = Math.min(minY, y);
+      maxY = Math.max(maxY, y);
+    }
+  }
+  if (minX === Infinity) {
+    minX = -10;
+    maxX = 10;
+    minY = -10;
+    maxY = 10;
+  }
+  const padding = 2;
+  const halfWidth = Math.max(Math.abs(minX), Math.abs(maxX)) + padding;
+  const halfHeight = Math.max(Math.abs(minY), Math.abs(maxY)) + padding;
+  const width10 = Math.max(2 * halfWidth, 10);
+  const height10 = Math.max(2 * halfHeight, 10);
+  const fauxBoard = {
+    type: "pcb_board",
+    pcb_board_id: "faux-board",
+    center: { x: 0, y: 0 },
+    // Always center at origin like real boards
+    width: width10,
+    height: height10,
+    thickness: 1.6,
+    // standard thickness
+    material: "fr4",
+    num_layers: 2
+    // No outline - will use rectangular shape
+  };
+  return fauxBoard;
+}
+
+// src/utils/preprocess-circuit-json.ts
+function addFauxBoardIfNeeded(circuitJson) {
+  const boards = su5(circuitJson).pcb_board.list();
+  if (boards.length > 0) {
+    return circuitJson;
+  }
+  const fauxBoard = createFauxBoard(circuitJson);
+  if (!fauxBoard) {
+    return circuitJson;
+  }
+  const boardThickness = fauxBoard.thickness;
+  const componentZ = boardThickness / 2;
+  const processedCircuitJson = circuitJson.map((element) => {
+    if (element.type === "cad_component") {
+      const cadComponent = element;
+      if (cadComponent.position) {
+        return {
+          ...cadComponent,
+          position: {
+            ...cadComponent.position,
+            z: componentZ
+          }
+        };
+      }
+    }
+    return element;
+  });
+  return [...processedCircuitJson, fauxBoard];
+}
+
 // src/CadViewerJscad.tsx
 import { jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
 var CadViewerJscad = forwardRef3(
@@ -31464,13 +31551,13 @@ var CadViewerJscad = forwardRef3(
     const childrenSoup = useConvertChildrenToCircuitJson(children);
     const internalCircuitJson = useMemo19(() => {
       const cj = soup ?? circuitJson;
-      return cj ?? childrenSoup;
+      return addFauxBoardIfNeeded(cj ?? childrenSoup);
     }, [soup, circuitJson, childrenSoup]);
     const boardGeom = useBoardGeomBuilder(internalCircuitJson);
     const initialCameraPosition = useMemo19(() => {
       if (!internalCircuitJson) return [5, -5, 5];
       try {
-        const board = su4(internalCircuitJson).pcb_board.list()[0];
+        const board = su6(internalCircuitJson).pcb_board.list()[0];
         if (!board) return [5, -5, 5];
         const { width: width10, height: height10 } = board;
         if (!width10 && !height10) {
@@ -31493,10 +31580,19 @@ var CadViewerJscad = forwardRef3(
         return [5, -5, 5];
       }
     }, [internalCircuitJson]);
+    const isFauxBoard = useMemo19(() => {
+      if (!internalCircuitJson) return false;
+      try {
+        const board = su6(internalCircuitJson).pcb_board.list()[0];
+        return !!board && board.pcb_board_id === "faux-board";
+      } catch (e) {
+        return false;
+      }
+    }, [internalCircuitJson]);
     const boardDimensions = useMemo19(() => {
       if (!internalCircuitJson) return void 0;
       try {
-        const board = su4(internalCircuitJson).pcb_board.list()[0];
+        const board = su6(internalCircuitJson).pcb_board.list()[0];
         if (!board) return void 0;
         return { width: board.width ?? 0, height: board.height ?? 0 };
       } catch (e) {
@@ -31507,7 +31603,7 @@ var CadViewerJscad = forwardRef3(
     const boardCenter = useMemo19(() => {
       if (!internalCircuitJson) return void 0;
       try {
-        const board = su4(internalCircuitJson).pcb_board.list()[0];
+        const board = su6(internalCircuitJson).pcb_board.list()[0];
         if (!board || !board.center) return void 0;
         return { x: board.center.x, y: board.center.y };
       } catch (e) {
@@ -31516,7 +31612,7 @@ var CadViewerJscad = forwardRef3(
       }
     }, [internalCircuitJson]);
     const { stls: boardStls, loading } = useStlsFromGeom(boardGeom);
-    const cad_components = su4(internalCircuitJson).cad_component.list();
+    const cad_components = su6(internalCircuitJson).cad_component.list();
     return /* @__PURE__ */ jsxs6(
       CadViewerContainer,
       {
@@ -31534,7 +31630,7 @@ var CadViewerJscad = forwardRef3(
             {
               stlData,
               color,
-              opacity: index2 === 0 ? 0.95 : 1,
+              opacity: index2 === 0 ? isFauxBoard ? 0.8 : 0.95 : 1,
               layerType
             },
             `board-${index2}`
@@ -31561,12 +31657,12 @@ var CadViewerJscad = forwardRef3(
 );
 
 // src/CadViewerManifold.tsx
-import { su as su13 } from "@tscircuit/circuit-json-util";
+import { su as su15 } from "@tscircuit/circuit-json-util";
 import { useEffect as useEffect22, useMemo as useMemo21, useState as useState15 } from "react";
 
 // src/hooks/useManifoldBoardBuilder.ts
 import { useState as useState14, useEffect as useEffect21, useMemo as useMemo20, useRef as useRef8 } from "react";
-import { su as su12 } from "@tscircuit/circuit-json-util";
+import { su as su14 } from "@tscircuit/circuit-json-util";
 import * as THREE24 from "three";
 
 // src/utils/manifold-mesh-to-three-geometry.ts
@@ -31592,7 +31688,7 @@ function manifoldMeshToThreeGeometry(manifoldMesh) {
 
 // src/utils/trace-texture.ts
 import * as THREE18 from "three";
-import { su as su5 } from "@tscircuit/circuit-json-util";
+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";
 }
@@ -31603,9 +31699,9 @@ function createTraceTextureForLayer({
   traceColor,
   traceTextureResolution
 }) {
-  const pcbTraces = su5(circuitJson).pcb_trace.list();
-  const allPcbVias = su5(circuitJson).pcb_via.list();
-  const allPcbPlatedHoles = su5(
+  const pcbTraces = su7(circuitJson).pcb_trace.list();
+  const allPcbVias = su7(circuitJson).pcb_via.list();
+  const allPcbPlatedHoles = su7(
     circuitJson
   ).pcb_plated_hole.list();
   const tracesOnLayer = pcbTraces.filter(
@@ -31686,7 +31782,7 @@ function createTraceTextureForLayer({
 // src/utils/silkscreen-texture.ts
 var import_text2 = __toESM(require_text(), 1);
 import * as THREE19 from "three";
-import { su as su6 } from "@tscircuit/circuit-json-util";
+import { su as su8 } from "@tscircuit/circuit-json-util";
 function createSilkscreenTextureForLayer({
   layer,
   circuitJson,
@@ -31694,11 +31790,11 @@ function createSilkscreenTextureForLayer({
   silkscreenColor = "rgb(255,255,255)",
   traceTextureResolution
 }) {
-  const pcbSilkscreenTexts = su6(circuitJson).pcb_silkscreen_text.list();
-  const pcbSilkscreenPaths = su6(circuitJson).pcb_silkscreen_path.list();
-  const pcbSilkscreenLines = su6(circuitJson).pcb_silkscreen_line.list();
-  const pcbSilkscreenRects = su6(circuitJson).pcb_silkscreen_rect.list();
-  const pcbSilkscreenCircles = su6(circuitJson).pcb_silkscreen_circle.list();
+  const pcbSilkscreenTexts = su8(circuitJson).pcb_silkscreen_text.list();
+  const pcbSilkscreenPaths = su8(circuitJson).pcb_silkscreen_path.list();
+  const pcbSilkscreenLines = su8(circuitJson).pcb_silkscreen_line.list();
+  const pcbSilkscreenRects = su8(circuitJson).pcb_silkscreen_rect.list();
+  const pcbSilkscreenCircles = su8(circuitJson).pcb_silkscreen_circle.list();
   const textsOnLayer = pcbSilkscreenTexts.filter((t) => t.layer === layer);
   const pathsOnLayer = pcbSilkscreenPaths.filter((p) => p.layer === layer);
   const linesOnLayer = pcbSilkscreenLines.filter((l) => l.layer === layer);
@@ -31953,7 +32049,7 @@ function createSilkscreenTextureForLayer({
 }
 
 // src/utils/manifold/process-non-plated-holes.ts
-import { su as su7 } from "@tscircuit/circuit-json-util";
+import { su as su9 } from "@tscircuit/circuit-json-util";
 
 // src/utils/hole-geoms.ts
 function createCircleHoleDrill({
@@ -32080,7 +32176,7 @@ function isRotatedPillHole(hole) {
 }
 function processNonPlatedHolesForManifold(Manifold, circuitJson, pcbThickness, manifoldInstancesForCleanup) {
   const nonPlatedHoleBoardDrills = [];
-  const pcbHoles = su7(circuitJson).pcb_hole.list();
+  const pcbHoles = su9(circuitJson).pcb_hole.list();
   const createPillOp = (width10, height10, depth) => {
     const pillOp = createRoundedRectPrism({
       Manifold,
@@ -32129,13 +32225,13 @@ function processNonPlatedHolesForManifold(Manifold, circuitJson, pcbThickness, m
 }
 
 // src/utils/manifold/process-plated-holes.ts
-import { su as su8 } from "@tscircuit/circuit-json-util";
+import { su as su10 } from "@tscircuit/circuit-json-util";
 import * as THREE20 from "three";
 var COPPER_COLOR = new THREE20.Color(...colors.copper);
 var PLATED_HOLE_LIP_HEIGHT = 0.05;
 function processPlatedHolesForManifold(Manifold, circuitJson, pcbThickness, manifoldInstancesForCleanup, boardClipVolume) {
   const platedHoleBoardDrills = [];
-  const pcbPlatedHoles = su8(circuitJson).pcb_plated_hole.list();
+  const pcbPlatedHoles = su10(circuitJson).pcb_plated_hole.list();
   const platedHoleCopperGeoms = [];
   const platedHoleCopperOpsForSubtract = [];
   const createPillOp = (width10, height10, depth) => {
@@ -32448,7 +32544,7 @@ function processPlatedHolesForManifold(Manifold, circuitJson, pcbThickness, mani
 }
 
 // src/utils/manifold/process-vias.ts
-import { su as su9 } from "@tscircuit/circuit-json-util";
+import { su as su11 } from "@tscircuit/circuit-json-util";
 import * as THREE21 from "three";
 
 // src/utils/via-geoms.ts
@@ -32485,7 +32581,7 @@ function createViaCopper({
 var COPPER_COLOR2 = new THREE21.Color(...colors.copper);
 function processViasForManifold(Manifold, circuitJson, pcbThickness, manifoldInstancesForCleanup, boardClipVolume) {
   const viaBoardDrills = [];
-  const pcbVias = su9(circuitJson).pcb_via.list();
+  const pcbVias = su11(circuitJson).pcb_via.list();
   const viaCopperGeoms = [];
   pcbVias.forEach((via, index2) => {
     if (typeof via.outer_diameter === "number") {
@@ -32534,12 +32630,12 @@ function processViasForManifold(Manifold, circuitJson, pcbThickness, manifoldIns
 }
 
 // src/utils/manifold/process-smt-pads.ts
-import { su as su10 } from "@tscircuit/circuit-json-util";
+import { su as su12 } from "@tscircuit/circuit-json-util";
 import * as THREE22 from "three";
 var COPPER_COLOR3 = new THREE22.Color(...colors.copper);
 function processSmtPadsForManifold(Manifold, circuitJson, pcbThickness, manifoldInstancesForCleanup, holeUnion, boardClipVolume) {
   const smtPadGeoms = [];
-  const smtPads = su10(circuitJson).pcb_smtpad.list();
+  const smtPads = su12(circuitJson).pcb_smtpad.list();
   smtPads.forEach((pad2, index2) => {
     const padBaseThickness = DEFAULT_SMT_PAD_THICKNESS;
     const zPos = pad2.layer === "bottom" ? -pcbThickness / 2 - BOARD_SURFACE_OFFSET.copper : pcbThickness / 2 + BOARD_SURFACE_OFFSET.copper;
@@ -32805,7 +32901,7 @@ function processCopperPoursForManifold(Manifold, CrossSection, circuitJson, pcbT
 }
 
 // src/utils/manifold/process-cutouts.ts
-import { su as su11 } from "@tscircuit/circuit-json-util";
+import { su as su13 } from "@tscircuit/circuit-json-util";
 var arePointsClockwise5 = (points) => {
   let area = 0;
   for (let i = 0; i < points.length; i++) {
@@ -32820,7 +32916,7 @@ var arePointsClockwise5 = (points) => {
 };
 function processCutoutsForManifold(Manifold, CrossSection, circuitJson, pcbThickness, manifoldInstancesForCleanup) {
   const cutoutOps = [];
-  const pcbCutouts = su11(circuitJson).pcb_cutout.list();
+  const pcbCutouts = su13(circuitJson).pcb_cutout.list();
   for (const cutout of pcbCutouts) {
     let cutoutOp;
     const cutoutHeight = pcbThickness * 1.5;
@@ -32912,11 +33008,12 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
   const [isLoading, setIsLoading] = useState14(true);
   const manifoldInstancesForCleanup = useRef8([]);
   const boardData = useMemo20(() => {
-    const boards = su12(circuitJson).pcb_board.list();
-    if (boards.length === 0) {
-      return null;
-    }
-    return boards[0];
+    const boards = su14(circuitJson).pcb_board.list();
+    return boards.length > 0 ? boards[0] : null;
+  }, [circuitJson]);
+  const isFauxBoard = useMemo20(() => {
+    const boards = su14(circuitJson).pcb_board.list();
+    return boards.length > 0 && boards[0].pcb_board_id === "faux-board";
   }, [circuitJson]);
   useEffect21(() => {
     if (!manifoldJSModule || !boardData) {
@@ -33084,7 +33181,8 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
             matColorArray[1],
             matColorArray[2]
           ),
-          material: boardData.material
+          material: boardData.material,
+          isFaux: isFauxBoard
         };
       }
       const { smtPadGeoms } = processSmtPadsForManifold(
@@ -33161,7 +33259,8 @@ var useManifoldBoardBuilder = (manifoldJSModule, circuitJson) => {
     pcbThickness,
     error,
     isLoading,
-    boardData
+    boardData,
+    isFauxBoard
   };
 };
 
@@ -33174,7 +33273,8 @@ var DEFAULT_SIDE = THREE25.DoubleSide;
 var createBoardMaterial = ({
   material,
   color,
-  side = DEFAULT_SIDE
+  side = DEFAULT_SIDE,
+  isFaux = false
 }) => {
   if (material === "fr4") {
     return new THREE25.MeshPhysicalMaterial({
@@ -33186,8 +33286,8 @@ var createBoardMaterial = ({
       ior: 1.45,
       sheen: 0,
       clearcoat: 0,
-      transparent: false,
-      opacity: 1,
+      transparent: isFaux,
+      opacity: isFaux ? 0.6 : 1,
       flatShading: true
     });
   }
@@ -33198,7 +33298,7 @@ var createBoardMaterial = ({
     metalness: 0.1,
     roughness: 0.8,
     transparent: true,
-    opacity: 0.9
+    opacity: isFaux ? 0.6 : 0.9
   });
 };
 
@@ -33212,7 +33312,8 @@ function createGeometryMeshes(geoms) {
       createBoardMaterial({
         material: geoms.board.material,
         color: geoms.board.color,
-        side: THREE26.DoubleSide
+        side: THREE26.DoubleSide,
+        isFaux: geoms.board.isFaux
       })
     );
     mesh.name = "board-geom";
@@ -33371,7 +33472,8 @@ var CadViewerManifold = ({
 }) => {
   const childrenCircuitJson = useConvertChildrenToCircuitJson(children);
   const circuitJson = useMemo21(() => {
-    return circuitJsonProp ?? childrenCircuitJson;
+    const rawCircuitJson = circuitJsonProp ?? childrenCircuitJson;
+    return addFauxBoardIfNeeded(rawCircuitJson);
   }, [circuitJsonProp, childrenCircuitJson]);
   const [manifoldJSModule, setManifoldJSModule] = useState15(null);
   const [manifoldLoadingError, setManifoldLoadingError] = useState15(null);
@@ -33451,7 +33553,7 @@ try {
     [textures, boardData, pcbThickness]
   );
   const cadComponents = useMemo21(
-    () => su13(circuitJson).cad_component.list(),
+    () => su15(circuitJson).cad_component.list(),
     [circuitJson]
   );
   const boardDimensions = useMemo21(() => {
@@ -33663,9 +33765,16 @@ var useContextMenu = ({ containerRef }) => {
   }, []);
   const handleClickAway = useCallback8((e) => {
     const target = e.target;
-    if (menuRef.current && !menuRef.current.contains(target)) {
-      setMenuVisible(false);
+    if (menuRef.current && menuRef.current.contains(target)) {
+      return;
+    }
+    const isInRadixPortal = target.closest?.(
+      "[data-radix-popper-content-wrapper], [data-radix-dropdown-menu-content], [data-radix-dropdown-menu-sub-content]"
+    );
+    if (isInRadixPortal) {
+      return;
     }
+    setMenuVisible(false);
   }, []);
   useEffect23(() => {
     if (menuVisible) {
@@ -39245,6 +39354,7 @@ var AppearanceMenu = () => {
           },
           onMouseEnter: () => setHoveredItem("appearance"),
           onMouseLeave: () => setHoveredItem(null),
+          onTouchStart: () => setHoveredItem("appearance"),
           children: [
             /* @__PURE__ */ jsx32("span", { style: { flex: 1, display: "flex", alignItems: "center" }, children: "Appearance" }),
             /* @__PURE__ */ jsx32(
@@ -39283,6 +39393,7 @@ var AppearanceMenu = () => {
                 },
                 onMouseEnter: () => setHoveredItem("boardBody"),
                 onMouseLeave: () => setHoveredItem(null),
+                onTouchStart: () => setHoveredItem("boardBody"),
                 children: [
                   /* @__PURE__ */ jsx32("span", { style: iconContainerStyles, children: visibility.boardBody && /* @__PURE__ */ jsx32(CheckIcon, {}) }),
                   /* @__PURE__ */ jsx32("span", { style: { display: "flex", alignItems: "center" }, children: "Board Body" })
@@ -39303,6 +39414,7 @@ var AppearanceMenu = () => {
                 },
                 onMouseEnter: () => setHoveredItem("topCopper"),
                 onMouseLeave: () => setHoveredItem(null),
+                onTouchStart: () => setHoveredItem("topCopper"),
                 children: [
                   /* @__PURE__ */ jsx32("span", { style: iconContainerStyles, children: visibility.topCopper && /* @__PURE__ */ jsx32(CheckIcon, {}) }),
                   /* @__PURE__ */ jsx32("span", { style: { display: "flex", alignItems: "center" }, children: "Top Copper" })
@@ -39323,6 +39435,7 @@ var AppearanceMenu = () => {
                 },
                 onMouseEnter: () => setHoveredItem("bottomCopper"),
                 onMouseLeave: () => setHoveredItem(null),
+                onTouchStart: () => setHoveredItem("bottomCopper"),
                 children: [
                   /* @__PURE__ */ jsx32("span", { style: iconContainerStyles, children: visibility.bottomCopper && /* @__PURE__ */ jsx32(CheckIcon, {}) }),
                   /* @__PURE__ */ jsx32("span", { style: { display: "flex", alignItems: "center" }, children: "Bottom Copper" })
@@ -39343,6 +39456,7 @@ var AppearanceMenu = () => {
                 },
                 onMouseEnter: () => setHoveredItem("topSilkscreen"),
                 onMouseLeave: () => setHoveredItem(null),
+                onTouchStart: () => setHoveredItem("topSilkscreen"),
                 children: [
                   /* @__PURE__ */ jsx32("span", { style: iconContainerStyles, children: visibility.topSilkscreen && /* @__PURE__ */ jsx32(CheckIcon, {}) }),
                   /* @__PURE__ */ jsx32("span", { style: { display: "flex", alignItems: "center" }, children: "Top Silkscreen" })
@@ -39363,6 +39477,7 @@ var AppearanceMenu = () => {
                 },
                 onMouseEnter: () => setHoveredItem("bottomSilkscreen"),
                 onMouseLeave: () => setHoveredItem(null),
+                onTouchStart: () => setHoveredItem("bottomSilkscreen"),
                 children: [
                   /* @__PURE__ */ jsx32("span", { style: iconContainerStyles, children: visibility.bottomSilkscreen && /* @__PURE__ */ jsx32(CheckIcon, {}) }),
                   /* @__PURE__ */ jsx32("span", { style: { display: "flex", alignItems: "center" }, children: "Bottom Silkscreen" })
@@ -39383,6 +39498,7 @@ var AppearanceMenu = () => {
                 },
                 onMouseEnter: () => setHoveredItem("smtModels"),
                 onMouseLeave: () => setHoveredItem(null),
+                onTouchStart: () => setHoveredItem("smtModels"),
                 children: [
                   /* @__PURE__ */ jsx32("span", { style: iconContainerStyles, children: visibility.smtModels && /* @__PURE__ */ jsx32(CheckIcon, {}) }),
                   /* @__PURE__ */ jsx32("span", { style: { display: "flex", alignItems: "center" }, children: "CAD Models" })
@@ -39512,6 +39628,7 @@ var ContextMenu = ({
                     },
                     onMouseEnter: () => setHoveredItem("camera"),
                     onMouseLeave: () => setHoveredItem(null),
+                    onTouchStart: () => setHoveredItem("camera"),
                     children: [
                       /* @__PURE__ */ jsx33(
                         "span",
@@ -39558,6 +39675,7 @@ var ContextMenu = ({
                         },
                         onMouseEnter: () => setHoveredItem(option),
                         onMouseLeave: () => setHoveredItem(null),
+                        onTouchStart: () => setHoveredItem(option),
                         children: [
                           /* @__PURE__ */ jsx33("span", { style: iconContainerStyles2, children: cameraPreset === option && /* @__PURE__ */ jsx33(DotIcon, {}) }),
                           /* @__PURE__ */ jsx33("span", { style: { display: "flex", alignItems: "center" }, children: option })
@@ -39583,6 +39701,7 @@ var ContextMenu = ({
                   },
                   onMouseEnter: () => setHoveredItem("autorotate"),
                   onMouseLeave: () => setHoveredItem(null),
+                  onTouchStart: () => setHoveredItem("autorotate"),
                   children: [
                     /* @__PURE__ */ jsx33("span", { style: iconContainerStyles2, children: autoRotate && /* @__PURE__ */ jsx33(CheckIcon, {}) }),
                     /* @__PURE__ */ jsx33("span", { style: { display: "flex", alignItems: "center" }, children: "Auto rotate" })
@@ -39602,6 +39721,7 @@ var ContextMenu = ({
                   onSelect: onDownloadGltf,
                   onMouseEnter: () => setHoveredItem("download"),
                   onMouseLeave: () => setHoveredItem(null),
+                  onTouchStart: () => setHoveredItem("download"),
                   children: /* @__PURE__ */ jsx33("span", { style: { display: "flex", alignItems: "center" }, children: "Download GLTF" })
                 }
               ),
@@ -39621,6 +39741,7 @@ var ContextMenu = ({
                   },
                   onMouseEnter: () => setHoveredItem("engine"),
                   onMouseLeave: () => setHoveredItem(null),
+                  onTouchStart: () => setHoveredItem("engine"),
                   children: [
                     /* @__PURE__ */ jsxs9("span", { style: { flex: 1, display: "flex", alignItems: "center" }, children: [
                       "Switch to ",
@@ -39853,7 +39974,7 @@ var CadViewer = (props) => {
 
 // src/convert-circuit-json-to-3d-svg.ts
 var import_debug = __toESM(require_browser(), 1);
-import { su as su14 } from "@tscircuit/circuit-json-util";
+import { su as su16 } from "@tscircuit/circuit-json-util";
 import * as THREE31 from "three";
 import { SVGRenderer } from "three/examples/jsm/renderers/SVGRenderer.js";
 
@@ -40082,11 +40203,11 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
   const pointLight = new THREE31.PointLight(16777215, Math.PI / 4);
   pointLight.position.set(-10, -10, 10);
   scene.add(pointLight);
-  const components = su14(circuitJson).cad_component.list();
+  const components = su16(circuitJson).cad_component.list();
   for (const component of components) {
     await renderComponent(component, scene);
   }
-  const boardData = su14(circuitJson).pcb_board.list()[0];
+  const boardData = su16(circuitJson).pcb_board.list()[0];
   const boardGeom = createBoardGeomFromCircuitJson(circuitJson);
   if (boardGeom) {
     for (const geom of boardGeom) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tscircuit/3d-viewer",
-  "version": "0.0.432",
+  "version": "0.0.434",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "type": "module",