@tscircuit/pcb-viewer 1.11.401 → 1.11.403

package/dist/index.js

@@ -4258,6 +4258,52 @@ var animateTransform = ({
 import { useCallback as useCallback11, useEffect as useEffect19, useMemo as useMemo10, useRef as useRef16, useState as useState13 } from "react";
 import { applyToPoint as applyToPoint19, inverse as inverse6 } from "transformation-matrix";
 
+// src/lib/get-trace-overlay-text.ts
+var getNonEmptyName = (name) => name?.trim() || null;
+function getAssociatedTraceName({
+  primitiveElement,
+  elements
+}) {
+  const sourceElementId = primitiveElement.source_trace_id;
+  if (!sourceElementId) return null;
+  const circuitJson = su(elements);
+  const sourceTrace = circuitJson.source_trace.get(sourceElementId);
+  const sourceTraceName = getNonEmptyName(sourceTrace?.name);
+  if (sourceTraceName) return sourceTraceName;
+  const sourceNet = circuitJson.source_net.get(sourceElementId);
+  const sourceNetName = getNonEmptyName(sourceNet?.name);
+  if (sourceNetName) return sourceNetName;
+  for (const sourceNetId of sourceTrace?.connected_source_net_ids ?? []) {
+    const connectedSourceNetName = getNonEmptyName(
+      circuitJson.source_net.get(sourceNetId)?.name
+    );
+    if (connectedSourceNetName) return connectedSourceNetName;
+  }
+  return null;
+}
+function getTraceOverlayInfo({
+  primitiveElement,
+  elements
+}) {
+  const trace = su(elements).source_trace.get(
+    primitiveElement?.source_trace_id
+  );
+  const traceLength = primitiveElement.trace_length;
+  const hasTraceLength = typeof traceLength === "number";
+  const maxLength = trace?.max_length;
+  const text = hasTraceLength ? `${traceLength.toFixed(3)}${typeof maxLength === "number" ? ` / ${maxLength}` : ""} mm` : "";
+  const name = getAssociatedTraceName({ primitiveElement, elements }) ?? getNonEmptyName(trace?.display_name);
+  if (!text && !name) return null;
+  const isOverLength = Boolean(
+    hasTraceLength && typeof maxLength === "number" && traceLength > maxLength
+  );
+  return {
+    text,
+    name,
+    isOverLength
+  };
+}
+
 // src/lib/x-ray-net.ts
 function getElementNetId(element, connectivityMap) {
   if (!element) return;
@@ -4282,6 +4328,32 @@ function isXRayCopper(element) {
     element.type
   );
 }
+function getXRayDisplayName(element, elements, connectivityMap) {
+  const directName = element.type === "pcb_trace" ? getAssociatedTraceName({ primitiveElement: element, elements }) : null;
+  if (directName) return directName;
+  const netId = getElementNetId(element, connectivityMap);
+  const connected = netId ? elements.filter(
+    (candidate) => getElementNetId(candidate, connectivityMap) === netId
+  ) : [];
+  for (const type of ["source_net", "source_trace"]) {
+    for (const candidate of connected) {
+      if (candidate.type === type && "name" in candidate && typeof candidate.name === "string" && candidate.name.trim())
+        return candidate.name.trim();
+    }
+  }
+  if (element.type === "pcb_trace") {
+    const label = getTraceOverlayInfo({
+      primitiveElement: element,
+      elements
+    })?.name;
+    if (label) return label;
+  }
+  for (const candidate of connected) {
+    if (candidate.type === "source_trace" && candidate.display_name?.trim())
+      return candidate.display_name.trim();
+  }
+  return "Net";
+}
 
 // src/lib/webgpu/create-worker.ts
 var createWebGpuWorker = async () => {
@@ -10073,52 +10145,6 @@ var PanelAnchorOffsetOverlay = ({
   );
 };
 
-// src/lib/get-trace-overlay-text.ts
-var getNonEmptyName = (name) => name?.trim() || null;
-function getAssociatedTraceName({
-  primitiveElement,
-  elements
-}) {
-  const sourceElementId = primitiveElement.source_trace_id;
-  if (!sourceElementId) return null;
-  const circuitJson = su(elements);
-  const sourceTrace = circuitJson.source_trace.get(sourceElementId);
-  const sourceTraceName = getNonEmptyName(sourceTrace?.name);
-  if (sourceTraceName) return sourceTraceName;
-  const sourceNet = circuitJson.source_net.get(sourceElementId);
-  const sourceNetName = getNonEmptyName(sourceNet?.name);
-  if (sourceNetName) return sourceNetName;
-  for (const sourceNetId of sourceTrace?.connected_source_net_ids ?? []) {
-    const connectedSourceNetName = getNonEmptyName(
-      circuitJson.source_net.get(sourceNetId)?.name
-    );
-    if (connectedSourceNetName) return connectedSourceNetName;
-  }
-  return null;
-}
-function getTraceOverlayInfo({
-  primitiveElement,
-  elements
-}) {
-  const trace = su(elements).source_trace.get(
-    primitiveElement?.source_trace_id
-  );
-  const traceLength = primitiveElement.trace_length;
-  const hasTraceLength = typeof traceLength === "number";
-  const maxLength = trace?.max_length;
-  const text = hasTraceLength ? `${traceLength.toFixed(3)}${typeof maxLength === "number" ? ` / ${maxLength}` : ""} mm` : "";
-  const name = getAssociatedTraceName({ primitiveElement, elements }) ?? getNonEmptyName(trace?.display_name);
-  if (!text && !name) return null;
-  const isOverLength = Boolean(
-    hasTraceLength && typeof maxLength === "number" && traceLength > maxLength
-  );
-  return {
-    text,
-    name,
-    isOverLength
-  };
-}
-
 // src/lib/filter-traces-if-multiple.ts
 function filterTracesIfMultiple(filterTraces) {
   const { primitives, is_showing_multiple_traces_length, elements } = filterTraces;
@@ -11047,7 +11073,7 @@ import { css as css3 } from "@emotion/css";
 // package.json
 var package_default = {
   name: "@tscircuit/pcb-viewer",
-  version: "1.11.400",
+  version: "1.11.402",
   main: "dist/index.js",
   type: "module",
   repository: {
@@ -11244,6 +11270,7 @@ var VisibilityContextMenu = ({
   position,
   onClose,
   onXRayNet,
+  xRayDisplayName = "Net",
   onExitXRayNet
 }) => {
   const engine = useRenderingEngine();
@@ -11348,17 +11375,21 @@ var VisibilityContextMenu = ({
           ...stacked ? { overflowY: "auto" } : {}
         },
         children: [
-          onXRayNet && /* @__PURE__ */ jsx20(
+          onXRayNet && /* @__PURE__ */ jsxs15(
             "button",
             {
               type: "button",
               role: "menuitem",
               className: itemStyle,
+              style: { whiteSpace: "normal", overflowWrap: "anywhere" },
               onClick: () => {
                 onXRayNet();
                 onClose();
               },
-              children: "X-Ray Net"
+              children: [
+                "X-Ray ",
+                xRayDisplayName
+              ]
             }
           ),
           onExitXRayNet && /* @__PURE__ */ jsx20(
@@ -12132,8 +12163,8 @@ var ToolbarOverlay = ({
   elements,
   onContextMenuOpenChange,
   getNetAtPoint,
-  xRayNetId,
-  onXRayNetChange
+  xRayNetIds = [],
+  onXRayNetsChange
 }) => {
   const isSmallScreen = useIsSmallScreen();
   const {
@@ -12198,6 +12229,7 @@ var ToolbarOverlay = ({
   }));
   const [contextMenuPosition, setContextMenuPosition] = useState12(null);
   const [contextNetId, setContextNetId] = useState12();
+  const [contextNetDisplayName, setContextNetDisplayName] = useState12("Net");
   const pointerStart = useRef14(null);
   const inEditMode = useGlobalStore((s) => s.in_edit_mode);
   const netAtEvent = (event) => {
@@ -12357,25 +12389,29 @@ var ToolbarOverlay = ({
         const start = pointerStart.current;
         if (!start || Math.hypot(event.clientX - start.x, event.clientY - start.y) > 4)
           return;
-        const net = netAtEvent(event);
-        if (!net) return;
-        if (net === xRayNetId) {
-          onXRayNetChange?.(null);
+        const hit = netAtEvent(event);
+        if (!hit) return;
+        const net = hit.netId;
+        if (xRayNetIds.includes(net)) {
+          onXRayNetsChange?.(xRayNetIds.filter((id) => id !== net));
           closeContextMenu();
         } else {
           setContextNetId(net);
+          setContextNetDisplayName(hit.displayName);
           onContextMenuOpenChange?.(true);
           setContextMenuPosition({ x: event.clientX, y: event.clientY });
         }
       },
       onDoubleClick: () => {
-        onXRayNetChange?.(null);
+        onXRayNetsChange?.([]);
         closeContextMenu();
       },
       onContextMenu: (event) => {
         event.preventDefault();
         event.stopPropagation();
-        setContextNetId(netAtEvent(event));
+        const hit = netAtEvent(event);
+        setContextNetId(hit?.netId);
+        setContextNetDisplayName(hit?.displayName ?? "Net");
         onContextMenuOpenChange?.(true);
         setContextMenuPosition({ x: event.clientX, y: event.clientY });
       },
@@ -12390,8 +12426,9 @@ var ToolbarOverlay = ({
           {
             position: contextMenuPosition,
             onClose: closeContextMenu,
-            onXRayNet: contextNetId && contextNetId !== xRayNetId ? () => onXRayNetChange?.(contextNetId) : void 0,
-            onExitXRayNet: xRayNetId ? () => onXRayNetChange?.(null) : void 0
+            xRayDisplayName: contextNetDisplayName,
+            onXRayNet: contextNetId && !xRayNetIds.includes(contextNetId) ? () => onXRayNetsChange?.([...xRayNetIds, contextNetId]) : void 0,
+            onExitXRayNet: xRayNetIds.length > 0 ? () => onXRayNetsChange?.([]) : void 0
           }
         ),
         /* @__PURE__ */ jsxs17(
@@ -12866,36 +12903,43 @@ var CanvasElementsRenderer = (props) => {
     () => getFullConnectivityMapFromCircuitJson(elements),
     [elements]
   );
-  const [xRayNetId, setXRayNetId] = useState13(null);
-  useEffect19(() => setXRayNetId(null), [connectivityMap]);
+  const [xRayNetIds, setXRayNetIds] = useState13([]);
+  useEffect19(() => setXRayNetIds([]), [connectivityMap]);
   const xRayElements = useMemo10(
-    () => xRayNetId ? elementsToRender.filter(
-      (element) => isXRayCopper(element) && getElementNetId(element, connectivityMap) === xRayNetId
+    () => xRayNetIds.length > 0 ? elementsToRender.filter(
+      (element) => isXRayCopper(element) && xRayNetIds.includes(
+        getElementNetId(element, connectivityMap) ?? ""
+      )
     ) : void 0,
-    [elementsToRender, connectivityMap, xRayNetId]
+    [elementsToRender, connectivityMap, xRayNetIds]
   );
   const getNetAtPoint = (point) => {
     if (!transform) return void 0;
+    const describeNet = (netId, element) => ({
+      netId,
+      displayName: getXRayDisplayName(element, elements, connectivityMap)
+    });
     const hits = getPrimitivesUnderPoint(
       primitivesWithoutInteractionMetadata,
       applyToPoint19(inverse6(transform), point),
       transform,
       selectedLayer,
-      Boolean(xRayNetId)
+      xRayNetIds.length > 0
     );
     const copper = hits.filter(
       (p) => isXRayCopper(p._element) && p.layer !== "drill"
     );
-    if (xRayNetId && copper.some(
-      (p) => getElementNetId(p._element, connectivityMap) === xRayNetId
-    ))
-      return xRayNetId;
     copper.sort(
       (a, b) => Number(b.layer === selectedLayer) - Number(a.layer === selectedLayer)
     );
     for (const primitive of copper) {
       const net = getElementNetId(primitive._element, connectivityMap);
-      if (net) return net;
+      if (net && xRayNetIds.includes(net))
+        return describeNet(net, primitive._element);
+    }
+    for (const primitive of copper) {
+      const net = getElementNetId(primitive._element, connectivityMap);
+      if (net) return describeNet(net, primitive._element);
     }
   };
   const [hoverState, setHoverState] = useState13({
@@ -12969,7 +13013,7 @@ var CanvasElementsRenderer = (props) => {
     props.width
   ]);
   const primitives = useMemo10(() => {
-    if (xRayNetId) return primitivesWithoutInteractionMetadata;
+    if (xRayNetIds.length > 0) return primitivesWithoutInteractionMetadata;
     const combinedPrimitiveIds = [
       ...hoverState.primitiveIdsInMousedOverNet,
       ...errorRelatedIds
@@ -12983,7 +13027,7 @@ var CanvasElementsRenderer = (props) => {
     primitivesWithoutInteractionMetadata,
     hoverState,
     errorRelatedIds,
-    xRayNetId
+    xRayNetIds
   ]);
   const onMouseOverPrimitives = useCallback11(
     (primitivesHoveredOver) => {
@@ -13025,7 +13069,7 @@ var CanvasElementsRenderer = (props) => {
       transform,
       primitives: primitivesWithoutInteractionMetadata,
       selectedLayer,
-      disableHoverHighlights: Boolean(xRayNetId),
+      disableHoverHighlights: xRayNetIds.length > 0,
       onMouseHoverOverPrimitives: onMouseOverPrimitives,
       children: /* @__PURE__ */ jsx25(
         EditPlacementOverlay,
@@ -13049,8 +13093,8 @@ var CanvasElementsRenderer = (props) => {
                 {
                   elements,
                   getNetAtPoint,
-                  xRayNetId,
-                  onXRayNetChange: setXRayNetId,
+                  xRayNetIds,
+                  onXRayNetsChange: setXRayNetIds,
                   onContextMenuOpenChange: props.onContextMenuOpenChange,
                   children: /* @__PURE__ */ jsx25(ErrorOverlay, { transform, elements, children: /* @__PURE__ */ jsx25(RatsNestOverlay, { transform, soup: elements, children: /* @__PURE__ */ jsx25(
                     PcbGroupOverlay,