@tscircuit/pcb-viewer 1.9.0 → 1.9.2

package/dist/index.d.ts

@@ -35,6 +35,7 @@ type EditEvent = EditComponentLocationEvent | EditTraceHintEvent;
 
 interface State {
     selected_layer: LayerRef;
+    pcb_viewer_id: string;
     in_edit_mode: boolean;
     in_move_footprint_mode: boolean;
     in_draw_trace_mode: boolean;

package/dist/index.js

@@ -11455,20 +11455,20 @@ var require_dist3 = __commonJS({
         });
         module2.exports = __toCommonJS2(src_exports2);
         var import_transformation_matrix10 = require("transformation-matrix");
-        var import_react18 = require("react");
+        var import_react19 = require("react");
         var useMouseMatrixTransform2 = function() {
             var props = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
-            var extRef = (0, import_react18.useRef)(null);
-            var _ref = _sliced_to_array((0, import_react18.useState)(0), 2), lastDragCancelTime = _ref[0], setLastDragCancelTime = _ref[1];
+            var extRef = (0, import_react19.useRef)(null);
+            var _ref = _sliced_to_array((0, import_react19.useState)(0), 2), lastDragCancelTime = _ref[0], setLastDragCancelTime = _ref[1];
             var _props_canvasElm;
             var outerCanvasElm = (_props_canvasElm = props.canvasElm) !== null && _props_canvasElm !== void 0 ? _props_canvasElm : extRef.current;
             var _props_initialTransform;
-            var _ref1 = _sliced_to_array((0, import_react18.useState)((_props_initialTransform = props.initialTransform) !== null && _props_initialTransform !== void 0 ? _props_initialTransform : (0, import_transformation_matrix10.identity)()), 2), internalTransform = _ref1[0], setInternalTransform = _ref1[1];
-            var _ref2 = _sliced_to_array((0, import_react18.useState)(0), 2), waitCounter = _ref2[0], setWaitCounter = _ref2[1];
-            var _ref3 = _sliced_to_array((0, import_react18.useReducer)(function(s) {
+            var _ref1 = _sliced_to_array((0, import_react19.useState)((_props_initialTransform = props.initialTransform) !== null && _props_initialTransform !== void 0 ? _props_initialTransform : (0, import_transformation_matrix10.identity)()), 2), internalTransform = _ref1[0], setInternalTransform = _ref1[1];
+            var _ref2 = _sliced_to_array((0, import_react19.useState)(0), 2), waitCounter = _ref2[0], setWaitCounter = _ref2[1];
+            var _ref3 = _sliced_to_array((0, import_react19.useReducer)(function(s) {
                 return s + 1;
             }, 0), 2), extChangeCounter = _ref3[0], incExtChangeCounter = _ref3[1];
-            var setTransform = (0, import_react18.useCallback)(function(newTransform) {
+            var setTransform = (0, import_react19.useCallback)(function(newTransform) {
                 if (props.onSetTransform) {
                     props.onSetTransform(newTransform);
                 }
@@ -11479,7 +11479,7 @@ var require_dist3 = __commonJS({
                 props.onSetTransform,
                 setInternalTransform
             ]);
-            var setTransformExt = (0, import_react18.useCallback)(function(newTransform) {
+            var setTransformExt = (0, import_react19.useCallback)(function(newTransform) {
                 setTransform(newTransform);
                 incExtChangeCounter();
             }, [
@@ -11487,10 +11487,10 @@ var require_dist3 = __commonJS({
             ]);
             var _props_transform;
             var transform = (_props_transform = props.transform) !== null && _props_transform !== void 0 ? _props_transform : internalTransform;
-            var cancelDrag = (0, import_react18.useCallback)(function() {
+            var cancelDrag = (0, import_react19.useCallback)(function() {
                 setLastDragCancelTime(Date.now());
             }, []);
-            (0, import_react18.useEffect)(function() {
+            (0, import_react19.useEffect)(function() {
                 var handleMouseDown = function handleMouseDown(e) {
                     m0 = getMousePos(e);
                     if (Date.now() - lastDragCancelTime < 100) return;
@@ -11582,7 +11582,7 @@ var require_dist3 = __commonJS({
                 extChangeCounter,
                 lastDragCancelTime
             ]);
-            var applyTransformToPoint = (0, import_react18.useCallback)(function(obj) {
+            var applyTransformToPoint = (0, import_react19.useCallback)(function(obj) {
                 return (0, import_transformation_matrix10.applyToPoint)(transform, obj);
             }, [
                 transform
@@ -11613,7 +11613,7 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 // src/PCBViewer.tsx
-var import_react17 = require("react");
+var import_react18 = require("react");
 var import_react_fiber = require("@tscircuit/react-fiber");
 var import_builder2 = require("@tscircuit/builder");
 // src/components/CanvasPrimitiveRenderer.tsx
@@ -12481,6 +12481,7 @@ var createStore = function() {
     return (0, import_zustand.createStore)(function(set) {
         return _object_spread_props(_object_spread({
             selected_layer: "top",
+            pcb_viewer_id: "pcb_viewer_".concat(Math.random().toString().slice(2, 10)),
             in_edit_mode: false,
             in_move_footprint_mode: false,
             in_draw_trace_mode: false,
@@ -12593,7 +12594,7 @@ var CanvasPrimitiveRenderer = function(param) {
     });
 };
 // src/components/CanvasElementsRenderer.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 // src/lib/convert-element-to-primitive.ts
 var import_soup_util = __toESM(require_dist2());
 // src/lib/util/expand-stroke.ts
@@ -12919,7 +12920,7 @@ var convertElementToPrimitives = function(element, allElements) {
                             y: y6,
                             w: width2,
                             h: height2,
-                            layer: "drill",
+                            layer: "top",
                             _element: element,
                             _parent_pcb_component: _parent_pcb_component,
                             _parent_source_component: _parent_source_component,
@@ -13656,7 +13657,7 @@ var import_soup2 = __toESM(require_dist());
 // package.json
 var package_default = {
     name: "@tscircuit/pcb-viewer",
-    version: "1.8.2",
+    version: "1.9.1",
     main: "dist/index.js",
     repository: "tscircuit/pcb-viewer",
     license: "MIT",
@@ -13680,6 +13681,7 @@ var package_default = {
         "@storybook/react": "^8.0.6",
         "@swc/core": "^1.4.12",
         "@tscircuit/builder": "^1.11.4",
+        "@tscircuit/core": "^0.0.41",
         "@tscircuit/eagle-xml-converter": "^0.0.6",
         "@tscircuit/props": "^0.0.46",
         "@tscircuit/react-fiber": "^1.1.25",
@@ -13707,6 +13709,7 @@ var package_default = {
         "@emotion/css": "^11.11.2",
         color: "^4.2.3",
         "react-supergrid": "^1.0.10",
+        "react-toastify": "^10.0.5",
         "transformation-matrix": "^2.13.0",
         zustand: "^4.5.2"
     }
@@ -14225,7 +14228,7 @@ var EditPlacementOverlay = function(param) {
 };
 // src/components/EditTraceHintOverlay.tsx
 var import_soup_util2 = __toESM(require_dist2());
-var import_react13 = require("react");
+var import_react14 = require("react");
 var import_transformation_matrix6 = require("transformation-matrix");
 // src/components/HotkeyActionMenu.tsx
 var import_css3 = require("@emotion/css");
@@ -14268,8 +14271,42 @@ var HotkeyActionMenu = function(param) {
         })
     });
 };
-// src/components/EditTraceHintOverlay.tsx
+// src/lib/toast.tsx
+var import_react13 = require("react");
+var import_react_toastify = require("react-toastify");
+var import_inject_style = require("react-toastify/dist/inject-style");
 var import_jsx_runtime10 = require("react/jsx-runtime");
+var useToast = function() {
+    var pcb_viewer_id = useGlobalStore(function(s) {
+        return s.pcb_viewer_id;
+    });
+    var toast = function(message, opts) {
+        return (0, import_react_toastify.toast)(message, _object_spread({
+            containerId: pcb_viewer_id
+        }, opts));
+    };
+    toast.error = function(message, opts) {
+        return import_react_toastify.toast.error(message, _object_spread({
+            containerId: pcb_viewer_id
+        }, opts));
+    };
+    toast.promise = import_react_toastify.toast.promise;
+    return toast;
+};
+var ToastContainer = function() {
+    (0, import_react13.useEffect)(function() {
+        (0, import_inject_style.injectStyle)();
+    }, []);
+    var pcb_viewer_id = useGlobalStore(function(s) {
+        return s.pcb_viewer_id;
+    });
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_react_toastify.ToastContainer, {
+        position: "top-center",
+        containerId: pcb_viewer_id
+    });
+};
+// src/components/EditTraceHintOverlay.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var isInsideOfSmtpad = function(elm, point) {
     var padding = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : 0;
     if (elm.shape === "circle") {
@@ -14302,11 +14339,12 @@ var EditTraceHintOverlay = function(param) {
     var children = param.children, disabledProp = param.disabled, transform = param.transform, soup = param.soup, cancelPanDrag = param.cancelPanDrag, onCreateEditEvent = param.onCreateEditEvent, onModifyEditEvent = param.onModifyEditEvent;
     var _containerRef_current;
     if (!transform) transform = (0, import_transformation_matrix6.identity)();
-    var containerRef = (0, import_react13.useRef)(null);
+    var containerRef = (0, import_react14.useRef)(null);
     var containerBounds = (_containerRef_current = containerRef.current) === null || _containerRef_current === void 0 ? void 0 : _containerRef_current.getBoundingClientRect();
-    var _ref = _sliced_to_array((0, import_react13.useState)(null), 2), selectedElement = _ref[0], setSelectedElement = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react13.useState)(null), 2), dragState = _ref1[0], setDragState = _ref1[1];
-    var _ref2 = _sliced_to_array((0, import_react13.useState)(false), 2), shouldCreateAsVia = _ref2[0], setShouldCreateAsVia = _ref2[1];
+    var _ref = _sliced_to_array((0, import_react14.useState)(null), 2), selectedElement = _ref[0], setSelectedElement = _ref[1];
+    var toast = useToast();
+    var _ref1 = _sliced_to_array((0, import_react14.useState)(null), 2), dragState = _ref1[0], setDragState = _ref1[1];
+    var _ref2 = _sliced_to_array((0, import_react14.useState)(false), 2), shouldCreateAsVia = _ref2[0], setShouldCreateAsVia = _ref2[1];
     var isElementSelected = selectedElement !== null;
     var in_edit_trace_mode = useGlobalStore(function(s) {
         return s.in_draw_trace_mode;
@@ -14317,7 +14355,7 @@ var EditTraceHintOverlay = function(param) {
         ogCenterScreen = (0, import_transformation_matrix6.applyToPoint)(transform, dragState === null || dragState === void 0 ? void 0 : dragState.originalCenter);
         dragEndScreen = (0, import_transformation_matrix6.applyToPoint)(transform, dragState === null || dragState === void 0 ? void 0 : dragState.dragEnd);
     }
-    (0, import_react13.useEffect)(function() {
+    (0, import_react14.useEffect)(function() {
         var keyDown = function keyDown(e) {
             if (e.key === "Escape") {
                 setSelectedElement(null);
@@ -14332,7 +14370,7 @@ var EditTraceHintOverlay = function(param) {
     }, [
         isElementSelected
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", {
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", {
         ref: containerRef,
         style: {
             position: "relative",
@@ -14354,6 +14392,10 @@ var EditTraceHintOverlay = function(param) {
                     for(var _iterator = soup[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
                         var e2 = _step.value;
                         if (e2.type === "pcb_smtpad" && isInsideOfSmtpad(e2, rwMousePoint, 10 / transform.a) || e2.type === "pcb_plated_hole" && isInsideOfPlatedHole(e2, rwMousePoint, 10 / transform.a)) {
+                            if (!e2.pcb_port_id) {
+                                toast.error('pcb_port_id is null on the selected "'.concat(e2.type, '"'));
+                                return;
+                            }
                             setSelectedElement(e2);
                             setShouldCreateAsVia(false);
                             setDragState({
@@ -14454,7 +14496,7 @@ var EditTraceHintOverlay = function(param) {
         },
         children: [
             children,
-            in_edit_trace_mode && (dragState === null || dragState === void 0 ? void 0 : dragState.editEvent) && ogCenterScreen && dragEndScreen && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("svg", {
+            in_edit_trace_mode && (dragState === null || dragState === void 0 ? void 0 : dragState.editEvent) && ogCenterScreen && dragEndScreen && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("svg", {
                 style: {
                     position: "absolute",
                     left: 0,
@@ -14466,7 +14508,7 @@ var EditTraceHintOverlay = function(param) {
                 width: containerBounds === null || containerBounds === void 0 ? void 0 : containerBounds.width,
                 height: containerBounds === null || containerBounds === void 0 ? void 0 : containerBounds.height,
                 children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", {
+                    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", {
                         stroke: "red",
                         d: "M ".concat(ogCenterScreen.x, " ").concat(ogCenterScreen.y, " ").concat(dragState === null || dragState === void 0 ? void 0 : dragState.editEvent.route.map(function(p) {
                             return (0, import_transformation_matrix6.applyToPoint)(transform, p);
@@ -14476,15 +14518,15 @@ var EditTraceHintOverlay = function(param) {
                     }),
                     dragState === null || dragState === void 0 ? void 0 : dragState.editEvent.route.map(function(r, i) {
                         var rScreen = (0, import_transformation_matrix6.applyToPoint)(transform, r);
-                        return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react13.Fragment, {
+                        return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react14.Fragment, {
                             children: [
-                                r.via && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
+                                r.via && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", {
                                     cx: rScreen.x,
                                     cy: rScreen.y,
                                     r: 16,
                                     stroke: "red"
                                 }),
-                                /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
+                                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", {
                                     cx: rScreen.x,
                                     cy: rScreen.y,
                                     r: 8,
@@ -14493,13 +14535,13 @@ var EditTraceHintOverlay = function(param) {
                             ]
                         }, "r-".concat(i));
                     }),
-                    shouldCreateAsVia && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
+                    shouldCreateAsVia && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", {
                         cx: dragEndScreen.x,
                         cy: dragEndScreen.y,
                         r: 16,
                         stroke: "red"
                     }, "via-outer-circle"),
-                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
+                    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", {
                         cx: dragEndScreen.x,
                         cy: dragEndScreen.y,
                         r: 8,
@@ -14507,7 +14549,7 @@ var EditTraceHintOverlay = function(param) {
                     })
                 ]
             }),
-            !disabled && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("svg", {
+            !disabled && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", {
                 style: {
                     position: "absolute",
                     left: 0,
@@ -14524,16 +14566,16 @@ var EditTraceHintOverlay = function(param) {
                     var route = e.route;
                     var pcb_port = (0, import_soup_util2.su)(soup).pcb_port.get(e.pcb_port_id);
                     var pcb_port_screen = (0, import_transformation_matrix6.applyToPoint)(transform, pcb_port);
-                    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react13.Fragment, {
+                    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react14.Fragment, {
                         children: [
-                            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("rect", {
+                            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("rect", {
                                 x: pcb_port_screen.x - 10,
                                 y: pcb_port_screen.y - 10,
                                 width: 20,
                                 height: 20,
                                 stroke: "red"
                             }, "rect-".concat(e.pcb_port_id)),
-                            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("path", {
+                            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", {
                                 stroke: "red",
                                 d: "M ".concat(pcb_port_screen.x, " ").concat(pcb_port_screen.y, " ").concat(route.map(function(r) {
                                     return (0, import_transformation_matrix6.applyToPoint)(transform, r);
@@ -14544,15 +14586,15 @@ var EditTraceHintOverlay = function(param) {
                             route.map(function(r) {
                                 return _object_spread({}, r, (0, import_transformation_matrix6.applyToPoint)(transform, r));
                             }).map(function(r, i) {
-                                return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_react13.Fragment, {
+                                return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_react14.Fragment, {
                                     children: [
-                                        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
+                                        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", {
                                             cx: r.x,
                                             cy: r.y,
                                             r: 8,
                                             stroke: "red"
                                         }),
-                                        r.via && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("circle", {
+                                        r.via && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("circle", {
                                             cx: r.x,
                                             cy: r.y,
                                             r: 16,
@@ -14566,13 +14608,13 @@ var EditTraceHintOverlay = function(param) {
                     }, e.pcb_trace_hint_id);
                 })
             }, "pcb-trace-hints"),
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", {
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", {
                 style: {
                     position: "absolute",
                     right: 0,
                     bottom: 0
                 },
-                children: isElementSelected && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(HotkeyActionMenu, {
+                children: isElementSelected && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(HotkeyActionMenu, {
                     hotkeys: [
                         {
                             key: "v",
@@ -14590,7 +14632,7 @@ var EditTraceHintOverlay = function(param) {
 // src/components/RatsNestOverlay.tsx
 var import_transformation_matrix7 = require("transformation-matrix");
 var import_soup_util3 = __toESM(require_dist2());
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var RatsNestOverlay = function(param) {
     var transform = param.transform, soup = param.soup, children = param.children;
     var isShowingRatsNest = useGlobalStore(function(s) {
@@ -14612,13 +14654,13 @@ var RatsNestOverlay = function(param) {
             groups.push(group);
         }
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", {
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", {
         style: {
             position: "relative"
         },
         children: [
             children,
-            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", {
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("svg", {
                 style: {
                     position: "absolute",
                     left: 0,
@@ -14647,7 +14689,7 @@ var RatsNestOverlay = function(param) {
                     }
                     return lines.map(function(param, index2) {
                         var _param = _sliced_to_array(param, 2), start = _param[0], end = _param[1];
-                        return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("line", {
+                        return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("line", {
                             x1: start.x,
                             y1: start.y,
                             x2: end.x,
@@ -14662,10 +14704,10 @@ var RatsNestOverlay = function(param) {
     });
 };
 // src/components/CanvasElementsRenderer.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var CanvasElementsRenderer = function(props) {
     var transform = props.transform, elements = props.elements;
-    var primitives = (0, import_react14.useMemo)(function() {
+    var primitives = (0, import_react15.useMemo)(function() {
         var primitives2 = props.elements.flatMap(function(elm) {
             return convertElementToPrimitives(elm, props.elements);
         });
@@ -14673,34 +14715,34 @@ var CanvasElementsRenderer = function(props) {
     }, [
         props.elements
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MouseElementTracker, {
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(MouseElementTracker, {
         transform: transform,
         primitives: primitives,
-        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(EditPlacementOverlay, {
+        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(EditPlacementOverlay, {
             disabled: !props.allowEditing,
             transform: transform,
             soup: elements,
             cancelPanDrag: props.cancelPanDrag,
             onCreateEditEvent: props.onCreateEditEvent,
             onModifyEditEvent: props.onModifyEditEvent,
-            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(EditTraceHintOverlay, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(EditTraceHintOverlay, {
                 disabled: !props.allowEditing,
                 transform: transform,
                 soup: elements,
                 cancelPanDrag: props.cancelPanDrag,
                 onCreateEditEvent: props.onCreateEditEvent,
                 onModifyEditEvent: props.onModifyEditEvent,
-                children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DimensionOverlay, {
+                children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DimensionOverlay, {
                     transform: transform,
-                    children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ToolbarOverlay, {
+                    children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ToolbarOverlay, {
                         elements: elements,
-                        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ErrorOverlay, {
+                        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ErrorOverlay, {
                             transform: transform,
                             elements: elements,
-                            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(RatsNestOverlay, {
+                            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RatsNestOverlay, {
                                 transform: transform,
                                 soup: elements,
-                                children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CanvasPrimitiveRenderer, {
+                                children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CanvasPrimitiveRenderer, {
                                     transform: transform,
                                     primitives: primitives,
                                     width: props.width,
@@ -14721,11 +14763,11 @@ var import_use_mouse_matrix_transform = __toESM(require_dist3());
 var noop = function noop() {};
 var isBrowser = typeof window !== "undefined";
 // node_modules/react-use/esm/useIsomorphicLayoutEffect.js
-var import_react15 = require("react");
-var useIsomorphicLayoutEffect = isBrowser ? import_react15.useLayoutEffect : import_react15.useEffect;
+var import_react16 = require("react");
+var useIsomorphicLayoutEffect = isBrowser ? import_react16.useLayoutEffect : import_react16.useEffect;
 var useIsomorphicLayoutEffect_default = useIsomorphicLayoutEffect;
 // node_modules/react-use/esm/useMeasure.js
-var import_react16 = require("react");
+var import_react17 = require("react");
 var defaultState = {
     x: 0,
     y: 0,
@@ -14737,9 +14779,9 @@ var defaultState = {
     right: 0
 };
 function useMeasure() {
-    var _a = (0, import_react16.useState)(null), element = _a[0], ref = _a[1];
-    var _b = (0, import_react16.useState)(defaultState), rect = _b[0], setRect = _b[1];
-    var observer = (0, import_react16.useMemo)(function() {
+    var _a = (0, import_react17.useState)(null), element = _a[0], ref = _a[1];
+    var _b = (0, import_react17.useState)(defaultState), rect = _b[0], setRect = _b[1];
+    var observer = (0, import_react17.useMemo)(function() {
         return new window.ResizeObserver(function(entries) {
             if (entries[0]) {
                 var _a2 = entries[0].contentRect, x = _a2.x, y = _a2.y, width = _a2.width, height = _a2.height, top_1 = _a2.top, left = _a2.left, bottom = _a2.bottom, right = _a2.right;
@@ -14844,20 +14886,20 @@ var applyEditEvents = function(soup, edit_events) {
     return soup;
 };
 // src/PCBViewer.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var defaultTransform = (0, import_transformation_matrix9.compose)((0, import_transformation_matrix9.translate)(400, 300), (0, import_transformation_matrix9.scale)(40, -40));
 var PCBViewer = function(param) {
     var children = param.children, soup = param.soup, _param_height = param.height, height = _param_height === void 0 ? 600 : _param_height, initialState = param.initialState, _param_allowEditing = param.allowEditing, allowEditing = _param_allowEditing === void 0 ? true : _param_allowEditing, editEventsProp = param.editEvents, onEditEventsChanged = param.onEditEventsChanged;
-    var _ref = _sliced_to_array((0, import_react17.useState)([]), 2), stateElements = _ref[0], setStateElements = _ref[1];
+    var _ref = _sliced_to_array((0, import_react18.useState)([]), 2), stateElements = _ref[0], setStateElements = _ref[1];
     var _useMeasure_default = _sliced_to_array(useMeasure_default(), 2), ref = _useMeasure_default[0], refDimensions = _useMeasure_default[1];
-    var _ref1 = _sliced_to_array((0, import_react17.useState)(defaultTransform), 2), transform = _ref1[0], setTransformInternal = _ref1[1];
+    var _ref1 = _sliced_to_array((0, import_react18.useState)(defaultTransform), 2), transform = _ref1[0], setTransformInternal = _ref1[1];
     var _ref2 = (0, import_use_mouse_matrix_transform.default)({
         transform: transform,
         onSetTransform: setTransformInternal
     }), transformRef = _ref2.ref, setTransform = _ref2.setTransform, cancelPanDrag = _ref2.cancelDrag;
-    var _ref3 = _sliced_to_array((0, import_react17.useState)([]), 2), editEvents = _ref3[0], setEditEvents = _ref3[1];
+    var _ref3 = _sliced_to_array((0, import_react18.useState)([]), 2), editEvents = _ref3[0], setEditEvents = _ref3[1];
     editEvents = editEventsProp !== null && editEventsProp !== void 0 ? editEventsProp : editEvents;
-    var _ref4 = _sliced_to_array((0, import_react17.useState)(null), 2), error = _ref4[0], setError = _ref4[1];
+    var _ref4 = _sliced_to_array((0, import_react18.useState)(null), 2), error = _ref4[0], setError = _ref4[1];
     var resetTransform = function() {
         var elmBounds = (refDimensions === null || refDimensions === void 0 ? void 0 : refDimensions.width) > 0 ? refDimensions : {
             width: 500,
@@ -14881,7 +14923,7 @@ var PCBViewer = function(param) {
         setTransform((0, import_transformation_matrix9.compose)((0, import_transformation_matrix9.translate)(((_elmBounds_width1 = elmBounds.width) !== null && _elmBounds_width1 !== void 0 ? _elmBounds_width1 : 0) / 2, ((_elmBounds_height1 = elmBounds.height) !== null && _elmBounds_height1 !== void 0 ? _elmBounds_height1 : 0) / 2), // translate(100, 0),
         (0, import_transformation_matrix9.scale)(scaleFactor, -scaleFactor, 0, 0), (0, import_transformation_matrix9.translate)(-center.x, -center.y)));
     };
-    (0, import_react17.useEffect)(function() {
+    (0, import_react18.useEffect)(function() {
         var doRender = function doRender() {
             return _doRender.apply(this, arguments);
         };
@@ -14917,7 +14959,7 @@ var PCBViewer = function(param) {
     }, [
         children
     ]);
-    (0, import_react17.useEffect)(function() {
+    (0, import_react18.useEffect)(function() {
         if (refDimensions && refDimensions.width !== 0 && (children || soup)) {
             resetTransform();
         }
@@ -14925,7 +14967,7 @@ var PCBViewer = function(param) {
         children,
         refDimensions
     ]);
-    if (error) return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", {
+    if (error) return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", {
         style: {
             color: "red"
         },
@@ -14938,7 +14980,7 @@ var PCBViewer = function(param) {
     var pcbElmsPreEdit = (soup !== null && soup !== void 0 ? soup : stateElements).filter(function(e) {
         return e.type.startsWith("pcb_") || e.type.startsWith("source_");
     });
-    var elements = (0, import_react17.useMemo)(function() {
+    var elements = (0, import_react18.useMemo)(function() {
         return applyEditEvents(pcbElmsPreEdit, editEvents);
     }, [
         pcbElmsPreEdit,
@@ -14959,31 +15001,34 @@ var PCBViewer = function(param) {
         setEditEvents(newEditEvents);
         onEditEventsChanged === null || onEditEventsChanged === void 0 ? void 0 : onEditEventsChanged(newEditEvents);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", {
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", {
         ref: transformRef,
-        children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", {
+        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", {
             ref: ref,
-            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ContextProviders, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(ContextProviders, {
                 initialState: initialState,
-                children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CanvasElementsRenderer, {
-                    transform: transform,
-                    height: height,
-                    width: refDimensions.width,
-                    allowEditing: allowEditing,
-                    cancelPanDrag: cancelPanDrag,
-                    onCreateEditEvent: onCreateEditEvent,
-                    onModifyEditEvent: onModifyEditEvent,
-                    grid: {
-                        spacing: 1,
-                        view_window: {
-                            left: 0,
-                            right: refDimensions.width || 500,
-                            top: height,
-                            bottom: 0
-                        }
-                    },
-                    elements: elements
-                }, refDimensions.width)
+                children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CanvasElementsRenderer, {
+                        transform: transform,
+                        height: height,
+                        width: refDimensions.width,
+                        allowEditing: allowEditing,
+                        cancelPanDrag: cancelPanDrag,
+                        onCreateEditEvent: onCreateEditEvent,
+                        onModifyEditEvent: onModifyEditEvent,
+                        grid: {
+                            spacing: 1,
+                            view_window: {
+                                left: 0,
+                                right: refDimensions.width || 500,
+                                top: height,
+                                bottom: 0
+                            }
+                        },
+                        elements: elements
+                    }, refDimensions.width),
+                    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ToastContainer, {})
+                ]
             })
         })
     });