@tscircuit/schematic-viewer 1.0.16 → 1.0.18

package/.storybook/preview.ts

@@ -1,5 +1,7 @@
 import type { Preview } from "@storybook/react"
 
+import "react-data-grid/lib/styles.css"
+
 const preview: Preview = {
   parameters: {
     actions: { argTypesRegex: "^on[A-Z].*" },

package/README.md

@@ -11,6 +11,9 @@ View schematics from [tscircuit jsx](https://tscircuit.com).
 ```tsx
 import { Schematic } from "@tscircuit/schematic-viewer"
 
+// To get styles for debug table
+import "react-data-grid/lib/styles.css"
+
 export const MyReactApp = () => (
   return (
     <Schematic>

package/dist/index.js

@@ -2046,19 +2046,6 @@ var SimpleInductor = ({ component: { source, schematic } }) => {
 
 // src/schematic-components/SimpleDiode.tsx
 var import_jsx_runtime13 = require("react/jsx-runtime");
-var SimpleDiode = ({ component: { source, schematic } }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SVGPathComponent_default, {
-    rotation: schematic.rotation,
-    center: schematic.center,
-    size: schematic.size,
-    paths: [
-      { stroke: "red", strokeWidth: 2, d: "M 0,0 H 21" },
-      { stroke: "red", strokeWidth: 2, d: "M 49,0 H 59" },
-      { stroke: "red", strokeWidth: 2, d: "M 49,0 L 21 14 V -14 Z" },
-      { stroke: "red", strokeWidth: 2, d: "M 49,-14 V 14" }
-    ]
-  });
-};
 
 // src/schematic-components/SchematicComponent.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
@@ -2096,9 +2083,7 @@ var SchematicComponent = ({ component }) => {
       });
     }
     case "simple_diode": {
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SimpleDiode, {
-        component: { source, schematic }
-      });
+      return null;
     }
     default: {
       return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", {
@@ -2200,12 +2185,18 @@ var SchematicElement = ({
       schematic_text: element
     });
   }
+  if (element.type === "source_error") {
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(RenderError_default, {
+      text: element.message
+    });
+  }
   return null;
 };
 
 // src/Schematic.tsx
 var import_use_mouse_matrix_transform = require("use-mouse-matrix-transform");
 var import_react_error_boundary = require("react-error-boundary");
+var import_table_viewer = require("@tscircuit/table-viewer");
 var import_jsx_runtime18 = require("react/jsx-runtime");
 var fallbackRender = (elm) => ({ error, resetErrorBoundary }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", {
@@ -2265,38 +2256,45 @@ var Schematic = ({
       throw e;
     });
   }, [children]);
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", {
-    style: {
-      width: "100%",
-      backgroundColor: "rgba(255,255,255,0)",
-      minHeight: 200,
-      overflow: "hidden",
-      position: "relative",
-      cursor: "grab",
-      ...style
-    },
-    ref: (el) => {
-      ref.current = el;
-      boundsRef(el);
-    },
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, {
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_supergrid.SuperGrid, {
-        stringifyCoord: (x, y, z) => {
-          if (z === 0)
-            return "";
-          return `${toMMSINeg(x, z)}, ${toMMSINeg(y, z)}`;
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", {
+        style: {
+          width: "100%",
+          backgroundColor: "rgba(255,255,255,0)",
+          minHeight: 200,
+          overflow: "hidden",
+          position: "relative",
+          cursor: "grab",
+          ...style
+        },
+        ref: (el) => {
+          ref.current = el;
+          boundsRef(el);
         },
-        width: bounds.width,
-        height: bounds.height,
-        transform: cameraTransform
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_supergrid.SuperGrid, {
+            stringifyCoord: (x, y, z) => {
+              if (z === 0)
+                return "";
+              return `${toMMSINeg(x, z)}, ${toMMSINeg(y, z)}`;
+            },
+            width: bounds.width,
+            height: bounds.height,
+            transform: cameraTransform
+          }),
+          elements == null ? void 0 : elements.map((elm, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_error_boundary.ErrorBoundary, {
+            fallbackRender: fallbackRender(elm),
+            children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicElement, {
+              element: elm,
+              allElements: elements
+            }, JSON.stringify(elm))
+          }, i))
+        ]
       }),
-      elements == null ? void 0 : elements.map((elm, i) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_react_error_boundary.ErrorBoundary, {
-        fallbackRender: fallbackRender(elm),
-        children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(SchematicElement, {
-          element: elm,
-          allElements: elements
-        }, JSON.stringify(elm))
-      }, i))
+      elements && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_table_viewer.SoupTableViewer, {
+        elements
+      })
     ]
   });
 };