@tscircuit/schematic-viewer 1.1.8 → 1.1.10

package/dist/index.js

@@ -949,7 +949,8 @@ var collectElementRefs = (elm, allElms) => {
     "schematic_trace",
     "schematic_port",
     "schematic_box",
-    "schematic_line"
+    "schematic_line",
+    "schematic_path"
   ].includes(elm.type)) {
     const schematic_children = allElms.filter(
       (e) => "schematic_component_id" in e && e.schematic_component_id === elm.schematic_component_id
@@ -1278,7 +1279,7 @@ var SVGPathComponent = ({ size, center, rotation, paths }) => {
     height: absoluteSize.height,
     viewBox: `${pathBounds.minX} ${pathBounds.minY} ${pathBounds.width} ${pathBounds.height}`,
     children: paths.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", {
-      fill: "none",
+      fill: p.fill ?? "none",
       strokeLinecap: "round",
       strokeWidth: 2 * (p.strokeWidth || 1),
       stroke: p.stroke || "red",
@@ -1711,6 +1712,8 @@ var import_jsx_runtime13 = require("react/jsx-runtime");
 var import_jsx_runtime14 = require("react/jsx-runtime");
 var SchematicComponent = ({ component }) => {
   const { source, schematic } = component;
+  if (!source.ftype)
+    return null;
   switch (source.ftype) {
     case "simple_resistor": {
       return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SimpleResistor, {
@@ -1768,7 +1771,7 @@ var SchematicBox = ({ box: { schematic } }) => {
     paths: [
       {
         stroke: "red",
-        strokeWidth: 0.2,
+        strokeWidth: 0.02,
         d: `M 0 0 l ${w} 0 l 0 ${h} l -${w} 0 z`
       }
     ]
@@ -1809,44 +1812,89 @@ var SchematicLine = ({ line: { schematic } }) => {
 };
 var SchematicLine_default = SchematicLine;
 
-// src/schematic-components/SchematicElement.tsx
+// src/schematic-components/SchematicPath.tsx
+var import_svg_path_generator3 = __toESM(require_svg_path_generator2());
 var import_jsx_runtime17 = require("react/jsx-runtime");
+var SchematicPath = (props) => {
+  console.log("SchematicPath", props);
+  const { points, is_filled, is_closed, fill_color } = props.path.schematic;
+  if (points.length === 0)
+    return null;
+  const path = (0, import_svg_path_generator3.default)();
+  path.moveTo(points[0].x, points[0].y);
+  for (const point of points.slice(1)) {
+    path.lineTo(point.x, point.y);
+  }
+  if (is_closed) {
+    path.closePath();
+  }
+  const d = path.toString();
+  const pathBounds = get_svg_path_bounds_default(d);
+  pathBounds.height = Math.max(pathBounds.height, 1);
+  pathBounds.width = Math.max(pathBounds.width, 1);
+  const center = {
+    x: pathBounds.minX + pathBounds.width / 2,
+    y: pathBounds.minY + pathBounds.height / 2
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SVGPathComponent, {
+    rotation: 0,
+    center,
+    size: pathBounds,
+    paths: [
+      {
+        stroke: is_filled ? "none" : fill_color ?? "red",
+        strokeWidth: 0.02,
+        fill: is_filled ? fill_color ?? "red" : void 0,
+        d
+      }
+    ]
+  });
+};
+var SchematicPath_default = SchematicPath;
+
+// src/schematic-components/SchematicElement.tsx
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var SchematicElement = ({
   element,
   allElements
 }) => {
   if (element.type === "schematic_component") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SchematicComponent_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicComponent_default, {
       component: collectElementRefs(element, allElements)
     });
   }
   if (element.type === "schematic_trace") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SchematicTrace_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicTrace_default, {
       trace: collectElementRefs(element, allElements)
     });
   }
   if (element.type === "schematic_port") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SchematicPort_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicPort_default, {
       port: collectElementRefs(element, allElements)
     });
   }
   if (element.type === "schematic_box") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SchematicBox_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicBox_default, {
       box: collectElementRefs(element, allElements)
     });
   }
   if (element.type === "schematic_line") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SchematicLine_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicLine_default, {
       line: collectElementRefs(element, allElements)
     });
   }
+  if (element.type === "schematic_path") {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicPath_default, {
+      path: collectElementRefs(element, allElements)
+    });
+  }
   if (element.type === "schematic_text") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(SchematicText_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicText_default, {
       schematic_text: element
     });
   }
   if (element.type === "source_error") {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(RenderError_default, {
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(RenderError_default, {
       text: element.message
     });
   }
@@ -1859,25 +1907,25 @@ var import_react_error_boundary = require("react-error-boundary");
 
 // src/schematic-components/TableViewer.tsx
 var import_react4 = require("react");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 var LazyTableViewer = (0, import_react4.lazy)(
   () => import("@tscircuit/table-viewer").then((m) => ({
     default: m.SoupTableViewer
   }))
 );
-var TableViewer = (params) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react4.Suspense, {
-  fallback: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", {
+var TableViewer = (params) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react4.Suspense, {
+  fallback: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", {
     children: "Loading..."
   }),
-  children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LazyTableViewer, {
+  children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LazyTableViewer, {
     ...params
   })
 });
 
 // src/Schematic.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 var fallbackRender = (elm) => ({ error, resetErrorBoundary }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", {
     style: { color: "red" },
     children: [
       "error rendering ",
@@ -1944,9 +1992,9 @@ var Schematic = ({
       throw e;
     });
   }, [children]);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, {
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, {
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", {
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", {
         style: {
           width: "100%",
           backgroundColor: "rgba(255,255,255,0)",
@@ -1961,7 +2009,7 @@ var Schematic = ({
           boundsRef(el);
         },
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_supergrid.SuperGrid, {
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_supergrid.SuperGrid, {
             stringifyCoord: (x, y, z) => {
               if (z === 0)
                 return "";
@@ -1971,16 +2019,16 @@ var Schematic = ({
             height: bounds.height,
             transform: cameraTransform
           }),
-          elements == null ? void 0 : elements.map((elm, i) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_error_boundary.ErrorBoundary, {
+          elements == null ? void 0 : elements.map((elm, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_error_boundary.ErrorBoundary, {
             fallbackRender: fallbackRender(elm),
-            children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SchematicElement, {
+            children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SchematicElement, {
               element: elm,
               allElements: elements
             }, JSON.stringify(elm))
           }, i))
         ]
       }),
-      showTable !== false && elements && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(TableViewer, {
+      showTable !== false && elements && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(TableViewer, {
         elements
       })
     ]