@tscircuit/3d-viewer 0.0.449 → 0.0.451

package/dist/index.js

@@ -14530,12 +14530,28 @@ function MixedStlModel({
   onHover,
   onUnhover,
   isHovered,
-  scale: scale3
+  scale: scale3,
+  isTranslucent = false
 }) {
   const obj = useGlobalObjLoader(url);
   const { rootObject } = useThree();
   const model = useMemo2(() => {
     if (obj && !(obj instanceof Error)) {
+      obj.traverse((child) => {
+        if (child instanceof THREE2.Mesh && child.material) {
+          const setMaterialTransparency = (mat) => {
+            mat.transparent = isTranslucent;
+            mat.opacity = isTranslucent ? 0.5 : 1;
+            mat.depthWrite = !isTranslucent;
+            mat.needsUpdate = true;
+          };
+          if (Array.isArray(child.material)) {
+            child.material.forEach(setMaterialTransparency);
+          } else {
+            setMaterialTransparency(child.material);
+          }
+        }
+      });
       return obj;
     }
     return new THREE2.Mesh(
@@ -14546,7 +14562,7 @@ function MixedStlModel({
         opacity: 0.25
       })
     );
-  }, [obj]);
+  }, [obj, isTranslucent]);
   useEffect4(() => {
     if (!rootObject || !model) return;
     rootObject.add(model);
@@ -14639,7 +14655,8 @@ function GltfModel({
   onHover,
   onUnhover,
   isHovered,
-  scale: scale3
+  scale: scale3,
+  isTranslucent = false
 }) {
   const { renderer, rootObject } = useThree();
   const [model, setModel] = useState3(null);
@@ -14651,7 +14668,24 @@ function GltfModel({
     loader.load(
       gltfUrl,
       (gltf) => {
-        if (isMounted) setModel(gltf.scene);
+        if (!isMounted) return;
+        const scene = gltf.scene;
+        scene.traverse((child) => {
+          if (child instanceof THREE4.Mesh && child.material) {
+            const setMaterialTransparency = (mat) => {
+              mat.transparent = isTranslucent;
+              mat.opacity = isTranslucent ? 0.5 : 1;
+              mat.depthWrite = !isTranslucent;
+              mat.needsUpdate = true;
+            };
+            if (Array.isArray(child.material)) {
+              child.material.forEach(setMaterialTransparency);
+            } else {
+              setMaterialTransparency(child.material);
+            }
+          }
+        });
+        setModel(scene);
       },
       void 0,
       (error) => {
@@ -14664,7 +14698,7 @@ function GltfModel({
     return () => {
       isMounted = false;
     };
-  }, [gltfUrl]);
+  }, [gltfUrl, isTranslucent]);
   useEffect5(() => {
     if (!model) return;
     if (position) model.position.fromArray(position);
@@ -28045,7 +28079,8 @@ var JscadModel = ({
   onHover,
   onUnhover,
   isHovered,
-  scale: scale3
+  scale: scale3,
+  isTranslucent = false
 }) => {
   const { rootObject } = useThree();
   const { threeGeom, material } = useMemo4(() => {
@@ -28056,11 +28091,13 @@ var JscadModel = ({
     const threeGeom2 = convertCSGToThreeGeom(jscadObject);
     const material2 = new THREE5.MeshStandardMaterial({
       vertexColors: true,
-      side: THREE5.DoubleSide
-      // Ensure both sides are visible
+      side: THREE5.DoubleSide,
+      transparent: isTranslucent,
+      opacity: isTranslucent ? 0.5 : 1,
+      depthWrite: !isTranslucent
     });
     return { threeGeom: threeGeom2, material: material2 };
-  }, [jscadPlan]);
+  }, [jscadPlan, isTranslucent]);
   const mesh = useMemo4(() => {
     if (!threeGeom) return null;
     return new THREE5.Mesh(threeGeom, material);
@@ -28122,7 +28159,8 @@ var FootprinterModel = ({
   onHover,
   onUnhover,
   isHovered,
-  scale: scale3
+  scale: scale3,
+  isTranslucent = false
 }) => {
   const { rootObject } = useThree();
   const group = useMemo5(() => {
@@ -28140,13 +28178,16 @@ var FootprinterModel = ({
       const threeGeom = convertCSGToThreeGeom(geomWithColor);
       const material = new THREE6.MeshStandardMaterial({
         vertexColors: true,
-        side: THREE6.DoubleSide
+        side: THREE6.DoubleSide,
+        transparent: isTranslucent,
+        opacity: isTranslucent ? 0.5 : 1,
+        depthWrite: !isTranslucent
       });
       const mesh = new THREE6.Mesh(threeGeom, material);
       group2.add(mesh);
     }
     return group2;
-  }, [footprint]);
+  }, [footprint, isTranslucent]);
   useEffect7(() => {
     if (!group || !rootObject) return;
     rootObject.add(group);
@@ -28368,7 +28409,8 @@ var AnyCadComponent = ({
         scale: cad_component2.model_unit_to_mm_scale_factor,
         onHover: handleHover,
         onUnhover: handleUnhover,
-        isHovered
+        isHovered,
+        isTranslucent: cad_component2.show_as_translucent_model
       },
       cad_component2.cad_component_id
     );
@@ -28386,7 +28428,8 @@ var AnyCadComponent = ({
         scale: cad_component2.model_unit_to_mm_scale_factor,
         onHover: handleHover,
         onUnhover: handleUnhover,
-        isHovered
+        isHovered,
+        isTranslucent: cad_component2.show_as_translucent_model
       },
       cad_component2.cad_component_id
     );
@@ -28399,7 +28442,8 @@ var AnyCadComponent = ({
         scale: cad_component2.model_unit_to_mm_scale_factor,
         onHover: handleHover,
         onUnhover: handleUnhover,
-        isHovered
+        isHovered,
+        isTranslucent: cad_component2.show_as_translucent_model
       },
       cad_component2.cad_component_id
     );
@@ -28417,7 +28461,8 @@ var AnyCadComponent = ({
         scale: cad_component2.model_unit_to_mm_scale_factor,
         onHover: handleHover,
         onUnhover: handleUnhover,
-        isHovered
+        isHovered,
+        isTranslucent: cad_component2.show_as_translucent_model
       }
     );
   }
@@ -28464,7 +28509,7 @@ import * as THREE15 from "three";
 // package.json
 var package_default = {
   name: "@tscircuit/3d-viewer",
-  version: "0.0.448",
+  version: "0.0.450",
   main: "./dist/index.js",
   module: "./dist/index.js",
   type: "module",
@@ -32727,12 +32772,12 @@ function createPlatedHoleDrill({
   Manifold,
   x,
   y,
-  outerDiameter,
+  holeDiameter,
   thickness,
   zOffset = 1e-3,
   segments = 32
 }) {
-  const boardHoleRadius = outerDiameter / 2 + zOffset;
+  const boardHoleRadius = holeDiameter / 2 + zOffset;
   const drill = Manifold.cylinder(
     thickness * 1.2,
     boardHoleRadius,
@@ -33005,7 +33050,7 @@ function processPlatedHolesForManifold(Manifold, CrossSection, circuitJson, pcbT
         Manifold,
         x: ph.x,
         y: ph.y,
-        outerDiameter: ph.hole_diameter * 1.02,
+        holeDiameter: ph.hole_diameter * 1.02,
         thickness: pcbThickness,
         zOffset: MANIFOLD_Z_OFFSET,
         segments: SMOOTH_CIRCLE_SEGMENTS
@@ -33488,22 +33533,42 @@ function createViaCopper({
   zOffset = 1e-3,
   segments = 32
 }) {
-  const copperPartThickness = thickness + 2 * zOffset;
-  let viaCopper = Manifold.cylinder(
-    copperPartThickness,
+  const padThickness = zOffset;
+  const platingThickness = zOffset;
+  if (outerDiameter < holeDiameter) {
+    throw new Error(
+      `Invalid via geometry: outerDiameter (${outerDiameter}) must be >= holeDiameter (${holeDiameter})`
+    );
+  }
+  const barrelRadius = Math.min(
+    outerDiameter / 2,
+    holeDiameter / 2 + platingThickness
+  );
+  const barrel = Manifold.cylinder(thickness, barrelRadius, -1, segments, true);
+  const topPad = Manifold.cylinder(
+    padThickness,
     outerDiameter / 2,
     -1,
     segments,
     true
-  );
+  ).translate([0, 0, thickness / 2]);
+  const bottomPad = Manifold.cylinder(
+    padThickness,
+    outerDiameter / 2,
+    -1,
+    segments,
+    true
+  ).translate([0, 0, -thickness / 2]);
+  const viaSolid = Manifold.union([barrel, topPad, bottomPad]);
+  const drillHeight = thickness + padThickness * 2;
   const drill = Manifold.cylinder(
-    copperPartThickness * 1.05,
+    drillHeight,
     holeDiameter / 2,
     -1,
     segments,
     true
   );
-  const finalViaCopperOp = viaCopper.subtract(drill);
+  const finalViaCopperOp = viaSolid.subtract(drill);
   return finalViaCopperOp.translate([x, y, 0]);
 }
 
@@ -33514,12 +33579,12 @@ function processViasForManifold(Manifold, circuitJson, pcbThickness, manifoldIns
   const pcbVias = su11(circuitJson).pcb_via.list();
   const viaCopperGeoms = [];
   pcbVias.forEach((via, index2) => {
-    if (typeof via.outer_diameter === "number") {
+    if (typeof via.hole_diameter === "number") {
       const translatedDrill = createPlatedHoleDrill({
         Manifold,
         x: via.x,
         y: via.y,
-        outerDiameter: via.outer_diameter,
+        holeDiameter: via.hole_diameter,
         thickness: pcbThickness,
         zOffset: MANIFOLD_Z_OFFSET,
         segments: SMOOTH_CIRCLE_SEGMENTS

package/package.json

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