@tscircuit/3d-viewer 0.0.426 → 0.0.428

package/dist/index.js

@@ -14228,7 +14228,7 @@ var require_browser = __commonJS({
 });
 
 // src/CadViewer.tsx
-import { useState as useState33, useCallback as useCallback19, useRef as useRef22, useEffect as useEffect39 } from "react";
+import { useState as useState33, useCallback as useCallback20, useRef as useRef22, useEffect as useEffect39 } from "react";
 
 // src/CadViewerJscad.tsx
 import { su as su4 } from "@tscircuit/circuit-json-util";
@@ -26789,7 +26789,7 @@ import * as THREE14 from "three";
 // package.json
 var package_default = {
   name: "@tscircuit/3d-viewer",
-  version: "0.0.425",
+  version: "0.0.427",
   main: "./dist/index.js",
   module: "./dist/index.js",
   type: "module",
@@ -27501,7 +27501,7 @@ var useCameraController = ({
 }) => {
   const controlsRef = useRef5(null);
   const baseDistance = useMemo14(() => {
-    const [x, y, z133] = initialCameraPosition ?? [5, 5, 5];
+    const [x, y, z133] = initialCameraPosition ?? [5, -5, 5];
     const distance2 = Math.hypot(
       x - defaultTarget.x,
       y - defaultTarget.y,
@@ -27649,7 +27649,7 @@ var RotationTracker = () => {
 var CadViewerContainer = forwardRef2(
   ({
     children,
-    initialCameraPosition = [5, 5, 5],
+    initialCameraPosition = [5, -5, 5],
     autoRotateDisabled,
     clickToInteractEnabled = false,
     boardDimensions,
@@ -29930,22 +29930,29 @@ var CadViewerJscad = forwardRef3(
     }, [soup, circuitJson, childrenSoup]);
     const boardGeom = useBoardGeomBuilder(internalCircuitJson);
     const initialCameraPosition = useMemo19(() => {
-      if (!internalCircuitJson) return [5, 5, 5];
+      if (!internalCircuitJson) return [5, -5, 5];
       try {
         const board = su4(internalCircuitJson).pcb_board.list()[0];
-        if (!board) return [5, 5, 5];
+        if (!board) return [5, -5, 5];
         const { width: width10, height: height10 } = board;
         if (!width10 && !height10) {
-          return [5, 5, 5];
+          return [5, -5, 5];
         }
         const minCameraDistance = 5;
         const adjustedBoardWidth = Math.max(width10, minCameraDistance);
         const adjustedBoardHeight = Math.max(height10, minCameraDistance);
         const largestDim = Math.max(adjustedBoardWidth, adjustedBoardHeight);
-        return [largestDim / 2, largestDim / 2, largestDim];
+        return [
+          largestDim * 0.4,
+          // Move right
+          -largestDim * 0.7,
+          // Move back (negative Y)
+          largestDim * 0.9
+          // Keep height but slightly lower than top-down
+        ];
       } catch (e) {
         console.error(e);
-        return [5, 5, 5];
+        return [5, -5, 5];
       }
     }, [internalCircuitJson]);
     const boardDimensions = useMemo19(() => {
@@ -31884,12 +31891,19 @@ try {
     return { x: center.x, y: center.y };
   }, [boardData]);
   const initialCameraPosition = useMemo21(() => {
-    if (!boardData) return [5, 5, 5];
+    if (!boardData) return [5, -5, 5];
     const { width: width10 = 0, height: height10 = 0 } = boardData;
     const safeWidth = Math.max(width10, 1);
     const safeHeight = Math.max(height10, 1);
     const largestDim = Math.max(safeWidth, safeHeight, 5);
-    return [largestDim * 0.75, largestDim * 0.75, largestDim * 0.75];
+    return [
+      largestDim * 0.4,
+      // Move right
+      -largestDim * 0.7,
+      // Move back (negative Y)
+      largestDim * 0.9
+      // Keep height but slightly lower than top-down
+    ];
   }, [boardData]);
   if (manifoldLoadingError) {
     return /* @__PURE__ */ jsxs7(
@@ -32111,11 +32125,51 @@ var useContextMenu = ({ containerRef }) => {
   };
 };
 
-// src/hooks/useGlobalDownloadGltf.ts
+// src/hooks/useCameraPreset.ts
 import { useCallback as useCallback9 } from "react";
+function useCameraPreset({
+  setAutoRotate,
+  setAutoRotateUserToggled,
+  setCameraPreset,
+  closeMenu,
+  cameraControllerRef,
+  isAnimatingRef,
+  lastPresetSelectTime
+}) {
+  const handleCameraPresetSelect = useCallback9(
+    (preset) => {
+      setAutoRotate(false);
+      setAutoRotateUserToggled(true);
+      setCameraPreset(preset);
+      closeMenu();
+      lastPresetSelectTime.current = Date.now();
+      if (preset === "Custom") return;
+      isAnimatingRef.current = true;
+      cameraControllerRef.current?.animateToPreset(preset);
+      setTimeout(() => {
+        isAnimatingRef.current = false;
+      }, 600);
+    },
+    [
+      setAutoRotate,
+      setAutoRotateUserToggled,
+      setCameraPreset,
+      closeMenu,
+      cameraControllerRef,
+      isAnimatingRef,
+      lastPresetSelectTime
+    ]
+  );
+  return {
+    handleCameraPresetSelect
+  };
+}
+
+// src/hooks/useGlobalDownloadGltf.ts
+import { useCallback as useCallback10 } from "react";
 import { GLTFExporter } from "three-stdlib";
 var useGlobalDownloadGltf = () => {
-  return useCallback9(() => {
+  return useCallback10(() => {
     const root = window.__TSCIRCUIT_THREE_OBJECT;
     if (!root) return;
     const exporter = new GLTFExporter();
@@ -38076,21 +38130,29 @@ var CadViewerInner = (props) => {
   } = useContextMenu({ containerRef });
   const autoRotateUserToggledRef = useRef22(autoRotateUserToggled);
   autoRotateUserToggledRef.current = autoRotateUserToggled;
-  const handleUserInteraction = useCallback19(() => {
+  const isAnimatingRef = useRef22(false);
+  const lastPresetSelectTime = useRef22(0);
+  const PRESET_COOLDOWN = 1e3;
+  const handleUserInteraction = useCallback20(() => {
+    if (isAnimatingRef.current || Date.now() - lastPresetSelectTime.current < PRESET_COOLDOWN) {
+      return;
+    }
     if (!autoRotateUserToggledRef.current) {
       setAutoRotate(false);
     }
-    setCameraPreset("Custom");
-  }, []);
-  const toggleAutoRotate = useCallback19(() => {
+    if (!menuVisible) {
+      setCameraPreset("Custom");
+    }
+  }, [menuVisible]);
+  const toggleAutoRotate = useCallback20(() => {
     setAutoRotate((prev) => !prev);
     setAutoRotateUserToggled(true);
   }, []);
   const downloadGltf = useGlobalDownloadGltf();
-  const closeMenu = useCallback19(() => {
+  const closeMenu = useCallback20(() => {
     setMenuVisible(false);
   }, [setMenuVisible]);
-  const handleCameraControllerReady = useCallback19(
+  const handleCameraControllerReady = useCallback20(
     (controller) => {
       cameraControllerRef.current = controller;
       externalCameraControllerReady?.(controller);
@@ -38100,15 +38162,15 @@ var CadViewerInner = (props) => {
     },
     [cameraPreset, externalCameraControllerReady]
   );
-  const handleCameraPresetSelect = useCallback19(
-    (preset) => {
-      setCameraPreset(preset);
-      closeMenu();
-      if (preset === "Custom") return;
-      cameraControllerRef.current?.animateToPreset(preset);
-    },
-    [closeMenu]
-  );
+  const { handleCameraPresetSelect } = useCameraPreset({
+    setAutoRotate,
+    setAutoRotateUserToggled,
+    setCameraPreset,
+    closeMenu,
+    cameraControllerRef,
+    isAnimatingRef,
+    lastPresetSelectTime
+  });
   useEffect39(() => {
     const stored = window.localStorage.getItem("cadViewerEngine");
     if (stored === "jscad" || stored === "manifold") {
@@ -38493,7 +38555,7 @@ async function convertCircuitJsonTo3dSvg(circuitJson, options = {}) {
 
 // src/hooks/exporter/gltf.ts
 import { GLTFExporter as GLTFExporter2 } from "three-stdlib";
-import { useEffect as useEffect40, useState as useState34, useMemo as useMemo27, useCallback as useCallback20 } from "react";
+import { useEffect as useEffect40, useState as useState34, useMemo as useMemo27, useCallback as useCallback21 } from "react";
 function useSaveGltfAs(options = {}) {
   const parse2 = useParser(options);
   const link = useMemo27(() => document.createElement("a"), []);
@@ -38514,7 +38576,7 @@ function useSaveGltfAs(options = {}) {
     []
   );
   let instance;
-  const ref = useCallback20((obj3D) => {
+  const ref = useCallback21((obj3D) => {
     instance = obj3D;
   }, []);
   return [ref, saveAs];
@@ -38523,7 +38585,7 @@ function useExportGltfUrl(options = {}) {
   const parse2 = useParser(options);
   const [url, setUrl] = useState34();
   const [error, setError] = useState34();
-  const ref = useCallback20(
+  const ref = useCallback21(
     (instance) => parse2(instance).then(setUrl).catch(setError),
     []
   );

package/package.json

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