@tscircuit/pcb-viewer 1.11.424 → 1.11.426

package/dist/index.js

@@ -11766,11 +11766,16 @@ function getElementNetId(element, connectivityMap) {
     const net = connectivityMap.getNetConnectedToId(id);
     if (net) return net;
   }
+  if ("source_net_id" in element) return element.source_net_id;
 }
 function isXRayCopper(element) {
-  return element && ["pcb_trace", "pcb_smtpad", "pcb_plated_hole", "pcb_via"].includes(
-    element.type
-  );
+  return element && [
+    "pcb_trace",
+    "pcb_smtpad",
+    "pcb_plated_hole",
+    "pcb_via",
+    "pcb_copper_pour"
+  ].includes(element.type);
 }
 function getXRayDisplayName(element, elements, connectivityMap) {
   const directName = element.type === "pcb_trace" ? getAssociatedTraceName({ primitiveElement: element, elements }) : null;
@@ -11820,6 +11825,61 @@ function getXRayGroups(netId, elements, connectivityMap) {
   });
 }
 
+// src/lib/draw-copper-pour.ts
+import {
+  CircuitToCanvasDrawer,
+  DEFAULT_PCB_COLOR_MAP,
+  drawPcbCopperPour
+} from "circuit-to-canvas";
+import color from "color";
+import { identity as identity2 } from "transformation-matrix";
+function getCopperPoursUnderPoint(elements, point2, selectedLayer) {
+  const canvas = document.createElement("canvas");
+  canvas.width = canvas.height = 1;
+  const ctx = canvas.getContext("2d");
+  return elements.filter((element) => {
+    if (element.type !== "pcb_copper_pour" || element.layer !== selectedLayer)
+      return false;
+    drawPcbCopperPour({
+      ctx,
+      pour: element,
+      realToCanvasMat: identity2(),
+      colorMap: DEFAULT_PCB_COLOR_MAP
+    });
+    return ctx.isPointInPath(
+      point2.x,
+      point2.y,
+      element.shape === "brep" ? "evenodd" : "nonzero"
+    );
+  });
+}
+function isCopperPourElement(element) {
+  return element.type === "pcb_copper_pour";
+}
+function drawCopperPourElementsForLayer({
+  canvas,
+  elements,
+  layers,
+  realToCanvasMat,
+  opacity = 1
+}) {
+  const copperPourElements = elements.filter(isCopperPourElement);
+  if (copperPourElements.length === 0 || opacity <= 0) return;
+  const drawer = new CircuitToCanvasDrawer(canvas);
+  drawer.configure({
+    colorOverrides: {
+      copper: Object.fromEntries(
+        Object.entries(DEFAULT_PCB_COLOR_MAP.copper).map(([layer, value]) => [
+          layer,
+          color(value).alpha(opacity).rgb().string()
+        ])
+      )
+    }
+  });
+  drawer.realToCanvasMat = realToCanvasMat;
+  drawer.drawElements(copperPourElements, { layers });
+}
+
 // src/lib/webgpu/create-worker.ts
 var createWebGpuWorker = async () => {
   const { default: WorkerConstructor } = await Promise.resolve().then(() => (init_pcb_webgpu_worker(), pcb_webgpu_worker_exports));
@@ -12083,7 +12143,7 @@ import colorParser from "color";
 import {
   applyToPoint as applyToPoint3,
   compose as compose6,
-  identity as identity2,
+  identity as identity3,
   inverse,
   translate as translate9
 } from "transformation-matrix";
@@ -12421,7 +12481,7 @@ var Drawer = class {
         canvas.getContext("2d")
       ])
     );
-    this.transform = identity2();
+    this.transform = identity3();
     this.transform.d *= -1;
     this.transform = compose6(this.transform, translate9(0, -500));
     this.lastPoint = { x: 0, y: 0 };
@@ -12930,39 +12990,6 @@ var getCopperLayerDrawOrder = (elements, selectedLayer) => {
   ];
 };
 
-// src/lib/draw-copper-pour.ts
-import {
-  CircuitToCanvasDrawer,
-  DEFAULT_PCB_COLOR_MAP
-} from "circuit-to-canvas";
-import color from "color";
-function isCopperPourElement(element) {
-  return element.type === "pcb_copper_pour";
-}
-function drawCopperPourElementsForLayer({
-  canvas,
-  elements,
-  layers,
-  realToCanvasMat,
-  opacity = 1
-}) {
-  const copperPourElements = elements.filter(isCopperPourElement);
-  if (copperPourElements.length === 0 || opacity <= 0) return;
-  const drawer = new CircuitToCanvasDrawer(canvas);
-  drawer.configure({
-    colorOverrides: {
-      copper: Object.fromEntries(
-        Object.entries(DEFAULT_PCB_COLOR_MAP.copper).map(([layer, value]) => [
-          layer,
-          color(value).alpha(opacity).rgb().string()
-        ])
-      )
-    }
-  });
-  drawer.realToCanvasMat = realToCanvasMat;
-  drawer.drawElements(copperPourElements, { layers });
-}
-
 // src/lib/draw-courtyard.ts
 import {
   CircuitToCanvasDrawer as CircuitToCanvasDrawer2,
@@ -14333,6 +14360,12 @@ var CanvasPrimitiveRenderer = ({
           realToCanvasMat: transform,
           drawSoldermask: false
         };
+        if (isShowingCopperPours) {
+          drawCopperPourElementsForLayer({
+            ...args,
+            opacity: copperPourOpacity
+          });
+        }
         drawPcbTraceElementsForLayer({ ...args, showCopperPours: false });
         drawPcbSmtPadElementsForLayer(args);
         drawPlatedHolePads(args);
@@ -15308,7 +15341,7 @@ var DebugGraphicsOverlay = ({
 
 // src/components/DimensionOverlay.tsx
 import { useCallback as useCallback6, useEffect as useEffect8, useMemo as useMemo6, useRef as useRef6, useState as useState5 } from "react";
-import { applyToPoint as applyToPoint10, identity as identity3, inverse as inverse3 } from "transformation-matrix";
+import { applyToPoint as applyToPoint10, identity as identity4, inverse as inverse3 } from "transformation-matrix";
 
 // src/lib/util/get-primitive-bounding-box.ts
 var mergeNumber = (a, b, fn) => fn(a, b);
@@ -15730,7 +15763,7 @@ var DimensionSnapGuides = memo(function DimensionSnapGuides2({
 import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 var SNAP_THRESHOLD_PX = 16;
 var EMPTY_PRIMITIVES = [];
-var DEFAULT_TRANSFORM = identity3();
+var DEFAULT_TRANSFORM = identity4();
 var shouldExcludePrimitiveFromSnapping = (primitive) => {
   if (primitive.pcb_drawing_type === "text") return true;
   const element = primitive._element;
@@ -16357,7 +16390,7 @@ var DimensionOverlay = ({
 
 // src/components/EditPlacementOverlay.tsx
 import { useRef as useRef7, useState as useState6 } from "react";
-import { applyToPoint as applyToPoint11, identity as identity4, inverse as inverse4 } from "transformation-matrix";
+import { applyToPoint as applyToPoint11, identity as identity5, inverse as inverse4 } from "transformation-matrix";
 import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 var isInsideOf = (pcb_component, point2, padding = 0) => {
   const halfWidth = pcb_component.width / 2;
@@ -16377,7 +16410,7 @@ var EditPlacementOverlay = ({
   onCreateEditEvent,
   onModifyEditEvent
 }) => {
-  if (!transform) transform = identity4();
+  if (!transform) transform = identity5();
   const containerRef = useRef7(null);
   const [activePcbComponentId, setActivePcbComponent] = useState6(
     null
@@ -16500,7 +16533,7 @@ var EditPlacementOverlay = ({
 // src/components/ErrorOverlay.tsx
 import { useRef as useRef8, Fragment as Fragment3 } from "react";
 import { css } from "@emotion/css";
-import { applyToPoint as applyToPoint12, identity as identity5 } from "transformation-matrix";
+import { applyToPoint as applyToPoint12, identity as identity6 } from "transformation-matrix";
 
 // src/lib/util/getPopupPosition.ts
 var getPopupPosition = (errorCenter, containerRef) => {
@@ -16664,7 +16697,7 @@ var errorMessageStyles = css`
 `;
 var ErrorOverlay = ({
   children,
-  transform = identity5(),
+  transform = identity6(),
   elements
 }) => {
   const containerRef = useRef8(null);
@@ -18239,7 +18272,7 @@ var MouseElementTracker = ({
 
 // src/components/PcbGroupOverlay.tsx
 import { applyToPoint as applyToPoint16 } from "transformation-matrix";
-import { identity as identity6 } from "transformation-matrix";
+import { identity as identity7 } from "transformation-matrix";
 import { useRef as useRef9, useEffect as useEffect12 } from "react";
 import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
 var GROUP_COLORS = [
@@ -18256,7 +18289,7 @@ var GROUP_COLORS = [
 ];
 var PcbGroupOverlay = ({
   children,
-  transform = identity6(),
+  transform = identity7(),
   elements = [],
   hoveredComponentIds = []
 }) => {
@@ -18504,7 +18537,7 @@ var PcbGroupOverlay = ({
 };
 
 // src/components/RatsNestOverlay.tsx
-import { applyToPoint as applyToPoint17, identity as identity7 } from "transformation-matrix";
+import { applyToPoint as applyToPoint17, identity as identity8 } from "transformation-matrix";
 import { useMemo as useMemo8 } from "react";
 import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
 var RatsNestOverlay = ({ transform, soup, children }) => {
@@ -18568,7 +18601,7 @@ var RatsNestOverlay = ({ transform, soup, children }) => {
     return lines;
   }, [soup, netMap, idToNetMap, isShowingRatsNest]);
   if (!soup || !isShowingRatsNest) return children;
-  if (!transform) transform = identity7();
+  if (!transform) transform = identity8();
   return /* @__PURE__ */ jsxs14("div", { style: { position: "relative" }, children: [
     children,
     /* @__PURE__ */ jsx19(
@@ -18619,7 +18652,7 @@ import { css as css3 } from "@emotion/css";
 // package.json
 var package_default = {
   name: "@tscircuit/pcb-viewer",
-  version: "1.11.423",
+  version: "1.11.425",
   main: "dist/index.js",
   type: "module",
   repository: {
@@ -18635,6 +18668,7 @@ var package_default = {
     "format:check": "biome format .",
     cosmos: "cosmos",
     "cosmos-export": "cosmos-export",
+    "test:copper-pour-x-ray": "bun run build && bun tests/copper-pour-x-ray/run.ts",
     "test:x-ray-net": "bun run build && bun tests/x-ray-net/run.ts",
     "test:component-focus": "bun run build && bun tests/component-focus/run.ts",
     "test:measurement-context-menu": "bun run build && bun tests/measurement-context-menu/run.ts",
@@ -18800,6 +18834,7 @@ var menuStyle = css2`
   padding: 4px;
   font: 12px sans-serif;
   box-shadow: 0 4px 16px #0008;
+  outline: none;
 `;
 var itemStyle = css2`
   display: block;
@@ -18859,7 +18894,7 @@ var VisibilityContextMenu = ({
         onClose();
       }
     };
-    ref.current?.querySelector("button")?.focus();
+    ref.current?.focus();
     window.addEventListener("pointerdown", dismiss, true);
     window.addEventListener("keydown", onKeyDown);
     window.addEventListener("resize", onClose);
@@ -18877,6 +18912,7 @@ var VisibilityContextMenu = ({
       {
         ref,
         role: "menu",
+        tabIndex: -1,
         "aria-label": "PCB context menu",
         className: menuStyle,
         onContextMenu: (event) => {
@@ -18889,16 +18925,17 @@ var VisibilityContextMenu = ({
         onKeyDown: (event) => {
           event.stopPropagation();
           const button = event.target.closest("button");
-          if (!button) return;
-          const menu = button.closest('[role="menu"]');
+          const menu = button?.closest('[role="menu"]') ?? ref.current;
+          if (!menu) return;
           const items = Array.from(
             menu.querySelectorAll("button:not(:disabled)")
           ).filter((item) => item.closest('[role="menu"]') === menu);
           if (event.key === "ArrowDown" || event.key === "ArrowUp") {
             event.preventDefault();
             const step = event.key === "ArrowDown" ? 1 : -1;
-            items[(items.indexOf(button) + step + items.length) % items.length]?.focus();
-          } else if (event.key === "ArrowRight" && button.hasAttribute("aria-haspopup")) {
+            const index = button ? items.indexOf(button) : step === 1 ? -1 : 0;
+            items[(index + step + items.length) % items.length]?.focus();
+          } else if (event.key === "ArrowRight" && button?.hasAttribute("aria-haspopup")) {
             event.preventDefault();
             button.click();
             requestAnimationFrame(
@@ -20501,7 +20538,7 @@ var ToolbarOverlay = ({
 
 // src/components/WarningGraphicsOverlay.tsx
 import { useEffect as useEffect18, useRef as useRef15 } from "react";
-import { applyToPoint as applyToPoint18, identity as identity8 } from "transformation-matrix";
+import { applyToPoint as applyToPoint18, identity as identity9 } from "transformation-matrix";
 
 // src/lib/util/get-pcb-warning-highlight.ts
 var isHighlightablePcbWarning = (element) => element.type === "pcb_manual_edit_conflict_warning" || element.type === "pcb_connector_not_in_accessible_orientation_warning";
@@ -20516,7 +20553,7 @@ var getPcbWarningHighlightLabel = (warning) => {
 import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 var WarningGraphicsOverlay = ({
   children,
-  transform = identity8(),
+  transform = identity9(),
   elements = []
 }) => {
   const [containerRef, { width, height }] = useMeasure_default();
@@ -20675,11 +20712,13 @@ var CanvasElementsRenderer = (props) => {
     hoveredErrorId,
     focusedErrorId,
     isShowingCopperPours,
+    copperPourOpacity,
     selectedLayer
   } = useGlobalStore((state) => ({
     hoveredErrorId: state.hovered_error_id,
     focusedErrorId: state.focused_error_id,
     isShowingCopperPours: state.is_showing_copper_pours,
+    copperPourOpacity: state.copper_pour_opacity,
     selectedLayer: state.selected_layer
   }));
   const activeErrorId = focusedErrorId ?? hoveredErrorId;
@@ -20709,11 +20748,11 @@ var CanvasElementsRenderer = (props) => {
   }, [xRayNetIds.length]);
   const xRayElements = useMemo10(
     () => xRayNetIds.length > 0 ? elementsToRender.filter(
-      (element) => isXRayCopper(element) && xRayNetIds.includes(
+      (element) => isXRayCopper(element) && (element.type !== "pcb_copper_pour" || copperPourOpacity > 0) && xRayNetIds.includes(
         getElementNetId(element, connectivityMap) ?? ""
       )
     ) : void 0,
-    [elementsToRender, connectivityMap, xRayNetIds]
+    [elementsToRender, connectivityMap, xRayNetIds, copperPourOpacity]
   );
   const hoverPrimitives = useMemo10(() => {
     if (!xRayElements) return primitivesWithoutInteractionMetadata;
@@ -20744,6 +20783,16 @@ var CanvasElementsRenderer = (props) => {
       displayName: getXRayDisplayName(element, elements, connectivityMap),
       groups: getXRayGroups(netId, elements, connectivityMap)
     });
+    if (isShowingCopperPours && copperPourOpacity > 0) {
+      for (const pour of getCopperPoursUnderPoint(
+        elementsToRender,
+        applyToPoint20(inverse6(transform), point2),
+        selectedLayer
+      ).reverse()) {
+        const net = getElementNetId(pour, connectivityMap);
+        if (net) return describeNet(net, pour);
+      }
+    }
     const hits = getPrimitivesUnderPoint(
       primitivesWithoutInteractionMetadata,
       applyToPoint20(inverse6(transform), point2),