@tscircuit/3d-viewer 0.0.634 → 0.0.635

package/dist/index.js

@@ -20161,7 +20161,7 @@ var JscadModel = ({
   );
 };
 
-// src/hooks/use-global-obj-loader.ts
+// src/hooks/use-global-model-loader.ts
 import { useEffect as useEffect10, useState as useState8 } from "react";
 
 // src/utils/vrml.ts
@@ -20183,21 +20183,24 @@ async function loadVrml(url) {
   return loader.parse(sanitizeVrmlIdentifiers(text), url);
 }
 
-// src/hooks/use-global-obj-loader.ts
-import { MTLLoader, OBJLoader } from "three-stdlib";
-if (typeof window !== "undefined" && !window.TSCIRCUIT_OBJ_LOADER_CACHE) {
-  window.TSCIRCUIT_OBJ_LOADER_CACHE = /* @__PURE__ */ new Map();
+// src/hooks/use-global-model-loader.ts
+import { Mesh as Mesh8, MeshStandardMaterial as MeshStandardMaterial4 } from "three";
+import { MTLLoader, OBJLoader, STLLoader } from "three-stdlib";
+if (typeof window !== "undefined" && !window.TSCIRCUIT_MODEL_LOADER_CACHE) {
+  window.TSCIRCUIT_MODEL_LOADER_CACHE = /* @__PURE__ */ new Map();
 }
-function useGlobalObjLoader(url) {
+function useGlobalModelLoader(url, modelType) {
   const [obj, setObj] = useState8(null);
   useEffect10(() => {
     if (!url) return;
     const cleanUrl = url.replace(/&cachebust_origin=$/, "");
-    const cache = window.TSCIRCUIT_OBJ_LOADER_CACHE;
+    const cachesByModelType = window.TSCIRCUIT_MODEL_LOADER_CACHE;
+    const cache = cachesByModelType.get(modelType) ?? /* @__PURE__ */ new Map();
+    cachesByModelType.set(modelType, cache);
     let hasUrlChanged = false;
-    async function loadAndParseObj() {
+    async function loadAndParseModel() {
       try {
-        if (cleanUrl.endsWith(".wrl")) {
+        if (modelType === "wrl") {
           return await loadVrml(cleanUrl);
         }
         const response = await fetch(cleanUrl);
@@ -20206,6 +20209,11 @@ function useGlobalObjLoader(url) {
             `Failed to fetch "${cleanUrl}": ${response.status} ${response.statusText}`
           );
         }
+        if (modelType === "stl") {
+          const geometry = new STLLoader().parse(await response.arrayBuffer());
+          const material = new MeshStandardMaterial4({ color: 8947848 });
+          return new Mesh8(geometry, material);
+        }
         const text = await response.text();
         const mtlContentArr = text.match(/newmtl[\s\S]*?endmtl/g);
         const objLoader = new OBJLoader();
@@ -20236,7 +20244,7 @@ function useGlobalObjLoader(url) {
           return result.clone();
         });
       }
-      const promise = loadAndParseObj().then((result) => {
+      const promise = loadAndParseModel().then((result) => {
         if (result instanceof Error) {
           return result;
         }
@@ -20255,7 +20263,7 @@ function useGlobalObjLoader(url) {
     return () => {
       hasUrlChanged = true;
     };
-  }, [url]);
+  }, [url, modelType]);
   return obj;
 }
 
@@ -20265,6 +20273,7 @@ import * as THREE13 from "three";
 import { jsx as jsx10 } from "react/jsx-runtime";
 function MixedStlModel({
   url,
+  modelType,
   position,
   rotation,
   modelOffset = [0, 0, 0],
@@ -20278,7 +20287,7 @@ function MixedStlModel({
   scale: scale11,
   isTranslucent = false
 }) {
-  const obj = useGlobalObjLoader(url);
+  const obj = useGlobalModelLoader(url, modelType);
   const model = useMemo8(() => {
     if (obj && !(obj instanceof Error)) {
       obj.traverse((child) => {
@@ -20352,11 +20361,11 @@ import {
   Color as Color3,
   Float32BufferAttribute,
   Group as Group5,
-  Mesh as Mesh9,
-  MeshStandardMaterial as MeshStandardMaterial5
+  Mesh as Mesh10,
+  MeshStandardMaterial as MeshStandardMaterial6
 } from "three";
 var DEFAULT_COLOR = new Color3(0.82, 0.82, 0.82);
-var createMaterial = (color) => new MeshStandardMaterial5({
+var createMaterial = (color) => new MeshStandardMaterial6({
   color: color ? new Color3(color[0], color[1], color[2]) : DEFAULT_COLOR
 });
 function applyFaceColorGroups(geometry, mesh) {
@@ -20426,7 +20435,7 @@ function occtMeshesToGroup(meshes) {
     geometry.setIndex(indices);
     geometry.clearGroups();
     const materials2 = applyFaceColorGroups(geometry, mesh);
-    const threeMesh = new Mesh9(
+    const threeMesh = new Mesh10(
       geometry,
       materials2.length > 1 ? materials2 : materials2[0]
     );
@@ -21096,6 +21105,7 @@ var AnyCadComponent = ({
           MixedStlModel,
           {
             url,
+            modelType: meshModelType,
             position: adjustedPosition,
             rotation: rotationOffset,
             modelOffset: modelTransform.modelPosition,
@@ -21111,7 +21121,7 @@ var AnyCadComponent = ({
             isHovered,
             isTranslucent
           },
-          `${cad_component.cad_component_id}-mixed-${url}`
+          `${cad_component.cad_component_id}-mixed-${meshModelType}-${url}`
         )
       );
     }
@@ -22051,7 +22061,7 @@ import * as THREE30 from "three";
 // package.json
 var package_default = {
   name: "@tscircuit/3d-viewer",
-  version: "0.0.633",
+  version: "0.0.634",
   repository: {
     type: "git",
     url: "https://github.com/tscircuit/3d-viewer"
@@ -28011,7 +28021,7 @@ function JscadBoardTextures({
 // src/three-components/STLModel.tsx
 import { useState as useState18, useEffect as useEffect29, useMemo as useMemo22 } from "react";
 import * as THREE50 from "three";
-import { STLLoader } from "three-stdlib";
+import { STLLoader as STLLoader2 } from "three-stdlib";
 function STLModel({
   stlUrl,
   stlData,
@@ -28023,7 +28033,7 @@ function STLModel({
   const { rootObject } = useThree();
   const [geom, setGeom] = useState18(null);
   useEffect29(() => {
-    const loader = new STLLoader();
+    const loader = new STLLoader2();
     if (stlData) {
       try {
         const geometry = loader.parse(stlData);
@@ -40456,10 +40466,10 @@ import * as THREE65 from "three";
 import * as THREE64 from "three";
 import { GLTFLoader as GLTFLoader3 } 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";
+import { STLLoader as STLLoader3 } from "three/examples/jsm/loaders/STLLoader.js";
 async function load3DModel(url) {
   if (url.endsWith(".stl")) {
-    const loader = new STLLoader2();
+    const loader = new STLLoader3();
     const geometry = await loader.loadAsync(url);
     const material = new THREE64.MeshStandardMaterial({
       color: 8947848,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tscircuit/3d-viewer",
-  "version": "0.0.634",
+  "version": "0.0.635",
   "repository": {
     "type": "git",
     "url": "https://github.com/tscircuit/3d-viewer"