@tscircuit/pcb-viewer 1.11.275 → 1.11.277

package/dist/index.js

@@ -7094,51 +7094,57 @@ var convertElementToPrimitives = (element, allElements) => {
   ) : void 0;
   switch (element.type) {
     case "pcb_panel": {
-      const { width, height } = element;
+      const { width, height, center } = element;
+      const cx = center?.x ?? 0;
+      const cy = center?.y ?? 0;
       return [
+        // Bottom line
         {
           _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
           pcb_drawing_type: "line",
-          x1: 0,
-          y1: 0,
-          x2: width,
-          y2: 0,
+          x1: cx - width / 2,
+          y1: cy - height / 2,
+          x2: cx + width / 2,
+          y2: cy - height / 2,
           width: 1,
           zoomIndependent: true,
           layer: "board",
           _element: element
         },
+        // Top line
         {
           _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
           pcb_drawing_type: "line",
-          x1: 0,
-          y1: height,
-          x2: width,
-          y2: height,
+          x1: cx - width / 2,
+          y1: cy + height / 2,
+          x2: cx + width / 2,
+          y2: cy + height / 2,
           width: 1,
           zoomIndependent: true,
           layer: "board",
           _element: element
         },
+        // Left line
         {
           _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
           pcb_drawing_type: "line",
-          x1: 0,
-          y1: 0,
-          x2: 0,
-          y2: height,
+          x1: cx - width / 2,
+          y1: cy - height / 2,
+          x2: cx - width / 2,
+          y2: cy + height / 2,
           width: 1,
           zoomIndependent: true,
           layer: "board",
           _element: element
         },
+        // Right line
         {
           _pcb_drawing_object_id: `line_${globalPcbDrawingObjectCount++}`,
           pcb_drawing_type: "line",
-          x1: width,
-          y1: 0,
-          x2: width,
-          y2: height,
+          x1: cx + width / 2,
+          y1: cy - height / 2,
+          x2: cx + width / 2,
+          y2: cy + height / 2,
           width: 1,
           zoomIndependent: true,
           layer: "board",
@@ -13305,7 +13311,7 @@ import { css as css3 } from "@emotion/css";
 // package.json
 var package_default = {
   name: "@tscircuit/pcb-viewer",
-  version: "1.11.274",
+  version: "1.11.276",
   main: "dist/index.js",
   type: "module",
   repository: "tscircuit/pcb-viewer",
@@ -13342,7 +13348,7 @@ var package_default = {
     "react-cosmos-plugin-vite": "7.0.0-beta.0",
     "react-dom": "19.1.0",
     "react-use": "^17.4.0",
-    tscircuit: "^0.0.758",
+    tscircuit: "^0.0.1015",
     tsup: "^8.0.2",
     "type-fest": "^3.0.0",
     typescript: "^5.4.4",
@@ -14442,96 +14448,104 @@ var PCBViewer = ({
     }),
     [initialState, disablePcbGroups]
   );
-  return /* @__PURE__ */ jsxs14("div", { ref: transformRef, style: { position: "relative" }, children: [
-    /* @__PURE__ */ jsx18("div", { ref, children: /* @__PURE__ */ jsxs14(
-      ContextProviders,
-      {
-        initialState: mergedInitialState,
-        disablePcbGroups,
-        children: [
-          /* @__PURE__ */ jsx18(
-            CanvasElementsRenderer,
-            {
-              transform,
-              height,
-              width: refDimensions.width,
-              allowEditing,
-              focusOnHover,
-              cancelPanDrag,
-              onCreateEditEvent,
-              onModifyEditEvent,
-              grid: {
-                spacing: 1,
-                view_window: {
-                  left: 0,
-                  right: refDimensions.width || 500,
-                  top: height,
-                  bottom: 0
-                }
-              },
-              elements,
-              debugGraphics
-            },
-            refDimensions.width
-          ),
-          /* @__PURE__ */ jsx18(ToastContainer, {})
-        ]
-      }
-    ) }),
-    clickToInteractEnabled && !isInteractionEnabled && /* @__PURE__ */ jsx18(
-      "div",
-      {
-        onClick: () => {
-          setIsInteractionEnabled(true);
-          resetTransform();
-        },
-        onTouchStart: (e) => {
-          const touch = e.touches[0];
-          touchStartRef.current = {
-            x: touch.clientX,
-            y: touch.clientY
-          };
-        },
-        onTouchEnd: (e) => {
-          const touch = e.changedTouches[0];
-          const start = touchStartRef.current;
-          if (!start) return;
-          const deltaX = Math.abs(touch.clientX - start.x);
-          const deltaY = Math.abs(touch.clientY - start.y);
-          if (deltaX < 10 && deltaY < 10) {
-            e.preventDefault();
-            setIsInteractionEnabled(true);
-            resetTransform();
-          }
-          touchStartRef.current = null;
-        },
-        style: {
-          position: "absolute",
-          inset: 0,
-          cursor: "pointer",
-          zIndex: zIndexMap.clickToInteractOverlay,
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          touchAction: "pan-x pan-y pinch-zoom"
-        },
-        children: /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsxs14(
+    "div",
+    {
+      ref: transformRef,
+      style: { position: "relative" },
+      onContextMenu: (event) => event.preventDefault(),
+      children: [
+        /* @__PURE__ */ jsx18("div", { ref, children: /* @__PURE__ */ jsxs14(
+          ContextProviders,
+          {
+            initialState: mergedInitialState,
+            disablePcbGroups,
+            children: [
+              /* @__PURE__ */ jsx18(
+                CanvasElementsRenderer,
+                {
+                  transform,
+                  height,
+                  width: refDimensions.width,
+                  allowEditing,
+                  focusOnHover,
+                  cancelPanDrag,
+                  onCreateEditEvent,
+                  onModifyEditEvent,
+                  grid: {
+                    spacing: 1,
+                    view_window: {
+                      left: 0,
+                      right: refDimensions.width || 500,
+                      top: height,
+                      bottom: 0
+                    }
+                  },
+                  elements,
+                  debugGraphics
+                },
+                refDimensions.width
+              ),
+              /* @__PURE__ */ jsx18(ToastContainer, {})
+            ]
+          }
+        ) }),
+        clickToInteractEnabled && !isInteractionEnabled && /* @__PURE__ */ jsx18(
           "div",
           {
+            onClick: () => {
+              setIsInteractionEnabled(true);
+              resetTransform();
+            },
+            onTouchStart: (e) => {
+              const touch = e.touches[0];
+              touchStartRef.current = {
+                x: touch.clientX,
+                y: touch.clientY
+              };
+            },
+            onTouchEnd: (e) => {
+              const touch = e.changedTouches[0];
+              const start = touchStartRef.current;
+              if (!start) return;
+              const deltaX = Math.abs(touch.clientX - start.x);
+              const deltaY = Math.abs(touch.clientY - start.y);
+              if (deltaX < 10 && deltaY < 10) {
+                e.preventDefault();
+                setIsInteractionEnabled(true);
+                resetTransform();
+              }
+              touchStartRef.current = null;
+            },
             style: {
-              backgroundColor: "rgba(0, 0, 0, 0.8)",
-              color: "white",
-              padding: "12px 24px",
-              borderRadius: "8px",
-              fontSize: "16px",
-              pointerEvents: "none"
+              position: "absolute",
+              inset: 0,
+              cursor: "pointer",
+              zIndex: zIndexMap.clickToInteractOverlay,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              touchAction: "pan-x pan-y pinch-zoom"
             },
-            children: typeof window !== "undefined" && ("ontouchstart" in window || navigator.maxTouchPoints > 0) ? "Touch to Interact" : "Click to Interact"
+            children: /* @__PURE__ */ jsx18(
+              "div",
+              {
+                style: {
+                  backgroundColor: "rgba(0, 0, 0, 0.8)",
+                  color: "white",
+                  padding: "12px 24px",
+                  borderRadius: "8px",
+                  fontSize: "16px",
+                  pointerEvents: "none"
+                },
+                children: typeof window !== "undefined" && ("ontouchstart" in window || navigator.maxTouchPoints > 0) ? "Touch to Interact" : "Click to Interact"
+              }
+            )
           }
         )
-      }
-    )
-  ] });
+      ]
+    }
+  );
 };
 export {
   CanvasElementsRenderer,