@tscircuit/runframe 0.0.898 → 0.0.900

package/dist/{chunk-2ZVVFUMY.js → chunk-ID4MISF7.js}

@@ -1225,13 +1225,52 @@ var RenderTimingsBar_default = RenderTimingsBar;
 // lib/components/RenderLogViewer/RenderLogViewer.tsx
 import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 var RenderLogViewer = ({
-  renderLog
+  renderLog,
+  onRerunWithDebug
 }) => {
   const [sortOption, setSortOption] = useState4(
     "chronological"
   );
+  const [selectedDebugOption, setSelectedDebugOption] = useState4("");
+  const debugOptions = [
+    { value: "", label: "None" },
+    {
+      value: "DEBUG=Group_doInitialSchematicTraceRender",
+      label: "DEBUG=Group_doInitialSchematicTraceRender"
+    },
+    {
+      value: "DEBUG=Group_doInitialSchematicLayoutMatchpack",
+      label: "DEBUG=Group_doInitialSchematicLayoutMatchpack"
+    },
+    {
+      value: "DEBUG=Group_doInitialPcbLayoutPack",
+      label: "DEBUG=Group_doInitialPcbLayoutPack"
+    }
+  ];
   if (!renderLog)
-    return /* @__PURE__ */ jsx16("div", { className: "rf-p-4 rf-bg-gray-100 rf-rounded-md", children: "No render log, make sure this tab is open when you render (TODO add a rerender button here)" });
+    return /* @__PURE__ */ jsxs11("div", { className: "rf-p-4 rf-bg-gray-100 rf-rounded-md", children: [
+      /* @__PURE__ */ jsx16("div", { className: "rf-mb-4", children: "No render log, make sure this tab is open when you render" }),
+      onRerunWithDebug && /* @__PURE__ */ jsxs11("div", { className: "rf-flex rf-gap-2 rf-items-center", children: [
+        /* @__PURE__ */ jsx16(
+          "select",
+          {
+            value: selectedDebugOption,
+            onChange: (e) => setSelectedDebugOption(e.target.value),
+            className: "rf-px-3 rf-py-1 rf-border rf-rounded rf-text-xs rf-bg-white",
+            children: debugOptions.map((option) => /* @__PURE__ */ jsx16("option", { value: option.value, children: option.label }, option.value))
+          }
+        ),
+        /* @__PURE__ */ jsx16(
+          Button,
+          {
+            onClick: () => onRerunWithDebug(selectedDebugOption),
+            size: "sm",
+            className: "rf-text-xs",
+            children: "Rerun Render with Debug"
+          }
+        )
+      ] })
+    ] });
   const orderedPhaseTimings = Object.entries(renderLog?.phaseTimings ?? {});
   if (sortOption === "chronological") {
     orderedPhaseTimings.sort(
@@ -1245,22 +1284,76 @@ var RenderLogViewer = ({
     0
   );
   return /* @__PURE__ */ jsxs11("div", { className: "rf-bg-white", children: [
-    /* @__PURE__ */ jsxs11("div", { className: "rf-flex rf-justify-between rf-items-center", children: [
+    /* @__PURE__ */ jsxs11("div", { className: "rf-flex rf-justify-between rf-items-center rf-mb-4", children: [
       /* @__PURE__ */ jsx16("div", { children: "Render Logs" }),
-      /* @__PURE__ */ jsxs11("div", { className: "rf-mb-4 rf-pr-2 rf-flex rf-text-xs rf-items-center", children: [
-        /* @__PURE__ */ jsx16("div", { className: "rf-mr-2", children: "Sort by:" }),
-        /* @__PURE__ */ jsxs11(
+      /* @__PURE__ */ jsxs11("div", { className: "rf-flex rf-gap-4 rf-items-center", children: [
+        onRerunWithDebug && /* @__PURE__ */ jsxs11("div", { className: "rf-flex rf-gap-2 rf-items-center", children: [
+          /* @__PURE__ */ jsx16(
+            "select",
+            {
+              value: selectedDebugOption,
+              onChange: (e) => setSelectedDebugOption(e.target.value),
+              className: "rf-px-3 rf-py-1 rf-border rf-rounded rf-text-xs rf-bg-white",
+              children: debugOptions.map((option) => /* @__PURE__ */ jsx16("option", { value: option.value, children: option.label }, option.value))
+            }
+          ),
+          /* @__PURE__ */ jsx16(
+            Button,
+            {
+              onClick: () => onRerunWithDebug(selectedDebugOption),
+              size: "sm",
+              className: "rf-text-xs",
+              children: "Rerun Render with Debug"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx16("div", { className: "rf-flex rf-gap-2 rf-items-center", children: /* @__PURE__ */ jsxs11(
           "select",
           {
-            value: sortOption,
-            onChange: (e) => setSortOption(e.target.value),
-            className: "rf-px-2 rf-py-1 rf-border rf-rounded rf-text-xs",
+            onChange: (e) => {
+              if (e.target.value) {
+                const debugOutput = renderLog?.debugOutputs?.find(
+                  (output) => output.name === e.target.value
+                );
+                if (debugOutput) {
+                  const blob = new Blob([debugOutput.content], {
+                    type: "text/plain"
+                  });
+                  const url = URL.createObjectURL(blob);
+                  const a = document.createElement("a");
+                  a.href = url;
+                  a.download = `debug-${debugOutput.name}.txt`;
+                  document.body.appendChild(a);
+                  a.click();
+                  document.body.removeChild(a);
+                  URL.revokeObjectURL(url);
+                }
+                e.target.value = "";
+              }
+            },
+            disabled: !renderLog?.debugOutputs || renderLog.debugOutputs.length === 0,
+            className: "rf-px-3 rf-py-1 rf-border rf-rounded rf-text-xs rf-bg-white disabled:rf-opacity-50 disabled:rf-cursor-not-allowed",
             children: [
-              /* @__PURE__ */ jsx16("option", { value: "chronological", children: "Phase Order" }),
-              /* @__PURE__ */ jsx16("option", { value: "longest", children: "Duration" })
+              /* @__PURE__ */ jsx16("option", { value: "", children: "Download Debug Output" }),
+              renderLog?.debugOutputs?.map((output) => /* @__PURE__ */ jsx16("option", { value: output.name, children: output.name }, output.name))
             ]
           }
-        )
+        ) }),
+        /* @__PURE__ */ jsxs11("div", { className: "rf-flex rf-text-xs rf-items-center", children: [
+          /* @__PURE__ */ jsx16("div", { className: "rf-mr-2", children: "Sort by:" }),
+          /* @__PURE__ */ jsxs11(
+            "select",
+            {
+              value: sortOption,
+              onChange: (e) => setSortOption(e.target.value),
+              className: "rf-px-2 rf-py-1 rf-border rf-rounded rf-text-xs",
+              children: [
+                /* @__PURE__ */ jsx16("option", { value: "chronological", children: "Phase Order" }),
+                /* @__PURE__ */ jsx16("option", { value: "longest", children: "Duration" })
+              ]
+            }
+          )
+        ] })
       ] })
     ] }),
     /* @__PURE__ */ jsx16(RenderTimingsBar_default, { phaseTimings: renderLog.phaseTimings }),
@@ -1333,7 +1426,7 @@ var useErrorTelemetry = ({
 };
 
 // package.json
-var version = "0.0.897";
+var version = "0.0.899";
 
 // lib/hooks/use-eval-versions.ts
 import { useEffect as useEffect5, useMemo as useMemo2, useState as useState6 } from "react";
@@ -3490,7 +3583,8 @@ var CircuitJsonPreview = ({
   activeEffectName,
   allowSelectingVersion = true,
   showFileMenu = false,
-  isWebEmbedded = false
+  isWebEmbedded = false,
+  onRerunWithDebug
 }) => {
   useStyles();
   const {
@@ -3918,7 +4012,13 @@ var CircuitJsonPreview = ({
                     ) : /* @__PURE__ */ jsx31(PreviewEmptyState_default, { onRunClicked })
                   }
                 ) }),
-                showRenderLogTab && (!availableTabs || availableTabs.includes("render_log")) && /* @__PURE__ */ jsx31(TabsContent, { value: "render_log", children: /* @__PURE__ */ jsx31(RenderLogViewer, { renderLog }) })
+                showRenderLogTab && (!availableTabs || availableTabs.includes("render_log")) && /* @__PURE__ */ jsx31(TabsContent, { value: "render_log", children: /* @__PURE__ */ jsx31(
+                  RenderLogViewer,
+                  {
+                    renderLog,
+                    onRerunWithDebug
+                  }
+                ) })
               ]
             }
           )

package/dist/preview.d.ts

@@ -25,6 +25,11 @@ interface RenderLog {
     progress?: number;
     renderEvents?: RenderEvent[];
     phaseTimings?: Record<string, number>;
+    debugOutputs?: Array<{
+        type: string;
+        name: string;
+        content: string;
+    }>;
 }
 
 type TabId = "code" | "pcb" | "schematic" | "assembly" | "cad" | "bom" | "circuit_json" | "errors" | "render_log";
@@ -100,6 +105,10 @@ interface PreviewContentProps {
      * Whether the preview is being embedded in a web page
      */
     isWebEmbedded?: boolean;
+    /**
+     * Callback to rerun render with debug options
+     */
+    onRerunWithDebug?: (debugOption: string) => void;
 }
 
 declare global {
@@ -108,7 +117,7 @@ declare global {
     }
 }
 
-declare const CircuitJsonPreview: ({ code, fsMap, onRunClicked, errorMessage, errorStack, circuitJson, autoroutingGraphics, showRightHeaderContent, showCodeTab, codeTabContent, showJsonTab, showRenderLogTab, onActiveTabChange, renderLog, showImportAndFormatButtons, className, headerClassName, leftHeaderContent, readOnly, isStreaming, autoroutingLog, onReportAutoroutingLog, isRunningCode, hasCodeChangedSinceLastRun, onEditEvent, editEvents, defaultActiveTab, defaultTab, availableTabs, autoRotate3dViewerDisabled, showSchematicDebugGrid, showToggleFullScreen, defaultToFullScreen, activeEffectName, allowSelectingVersion, showFileMenu, isWebEmbedded, }: PreviewContentProps) => react_jsx_runtime.JSX.Element;
+declare const CircuitJsonPreview: ({ code, fsMap, onRunClicked, errorMessage, errorStack, circuitJson, autoroutingGraphics, showRightHeaderContent, showCodeTab, codeTabContent, showJsonTab, showRenderLogTab, onActiveTabChange, renderLog, showImportAndFormatButtons, className, headerClassName, leftHeaderContent, readOnly, isStreaming, autoroutingLog, onReportAutoroutingLog, isRunningCode, hasCodeChangedSinceLastRun, onEditEvent, editEvents, defaultActiveTab, defaultTab, availableTabs, autoRotate3dViewerDisabled, showSchematicDebugGrid, showToggleFullScreen, defaultToFullScreen, activeEffectName, allowSelectingVersion, showFileMenu, isWebEmbedded, onRerunWithDebug, }: PreviewContentProps) => react_jsx_runtime.JSX.Element;
 
 interface BomTableProps {
     circuitJson: AnyCircuitElement[];

package/dist/preview.js

@@ -8,7 +8,7 @@ import {
   linkify,
   useOrderDialog,
   useOrderDialogCli
-} from "./chunk-2ZVVFUMY.js";
+} from "./chunk-ID4MISF7.js";
 export {
   BomTable,
   CadViewer,

package/dist/runner.js

@@ -23,7 +23,7 @@ import {
   useRunFrameStore,
   useRunnerStore,
   useStyles
-} from "./chunk-2ZVVFUMY.js";
+} from "./chunk-ID4MISF7.js";
 
 // lib/components/RunFrame/RunFrame.tsx
 import { createCircuitWebWorker } from "@tscircuit/eval/worker";
@@ -176,6 +176,7 @@ var RunFrame = (props) => {
   const [isRunning, setIsRunning] = useState(false);
   const [dependenciesLoaded, setDependenciesLoaded] = useState(false);
   const [activeAsyncEffects, setActiveAsyncEffects] = useState({});
+  const [currentDebugOption, setCurrentDebugOption] = useState("");
   const activeEffectName = Object.values(activeAsyncEffects).sort(
     (a, b) => a.startTime - b.startTime
   )[0]?.effectName;
@@ -248,7 +249,7 @@ var RunFrame = (props) => {
       setIsRunning(false);
       return;
     }
-    const wasTriggeredByRunButton = props.showRunButton && runCountTrigger !== lastRunCountTriggerRef.current;
+    const wasTriggeredByRunButton = runCountTrigger !== lastRunCountTriggerRef.current;
     if (lastFsMapRef.current && circuitJson) {
       const changes = getChangesBetweenFsMaps(lastFsMapRef.current, fsMap);
       if (Object.keys(changes).length > 0) {
@@ -272,7 +273,7 @@ var RunFrame = (props) => {
       setError(null);
       setRenderLog(null);
       setActiveAsyncEffects({});
-      const renderLog2 = { progress: 0 };
+      const renderLog2 = { progress: 0, debugOutputs: [] };
       let cancelled = false;
       cancelExecutionRef.current = () => {
         cancelled = true;
@@ -292,6 +293,9 @@ var RunFrame = (props) => {
       });
       globalThis.runFrameWorker = worker;
       setLastRunEvalVersion(resolvedEvalVersion);
+      if (currentDebugOption?.trim()) {
+        worker.enableDebug(currentDebugOption.replace("DEBUG=", ""));
+      }
       debug("Starting render...");
       props.onRenderStarted?.();
       const fsMapObj2 = fsMap instanceof Map ? Object.fromEntries(fsMap.entries()) : fsMap;
@@ -348,6 +352,17 @@ var RunFrame = (props) => {
       worker.on("autorouting:progress", (event) => {
         setAutoroutingGraphics(event.debugGraphics);
       });
+      worker.on("debug:logOutput", (event) => {
+        renderLog2.debugOutputs = renderLog2.debugOutputs ?? [];
+        renderLog2.debugOutputs.push({
+          type: "debug",
+          name: event.name,
+          content: event.content
+        });
+        if (!cancelled) {
+          setRenderLog({ ...renderLog2 });
+        }
+      });
       debug("Executing fsMap...");
       const evalResult = await worker.executeWithFsMap({
         entrypoint: props.entrypoint,
@@ -404,6 +419,7 @@ var RunFrame = (props) => {
       }
       setIsRunning(false);
       setActiveAsyncEffects({});
+      setCurrentDebugOption("");
       cancelExecutionRef.current = null;
     };
     runMutex.runWithMutex(runWorker);
@@ -413,7 +429,8 @@ var RunFrame = (props) => {
     runCountTrigger,
     props.evalVersion,
     props.mainComponentPath,
-    props.isLoadingFiles
+    props.isLoadingFiles,
+    currentDebugOption
   ]);
   const lastEditEventRef = useRef2(null);
   const dragTimeout = useRef2(null);
@@ -565,7 +582,11 @@ var RunFrame = (props) => {
       errorStack: error?.stack,
       onEditEvent: handleEditEvent,
       editEvents: props.editEvents,
-      defaultToFullScreen: props.defaultToFullScreen
+      defaultToFullScreen: props.defaultToFullScreen,
+      onRerunWithDebug: (debugOption) => {
+        setCurrentDebugOption(debugOption || "");
+        incRunCountTrigger(1);
+      }
     }
   );
 };