agentfootprint-lens 0.23.7 → 0.23.9

package/dist/index.cjs

@@ -2930,7 +2930,6 @@ function layoutLensGraph(output, options = {}) {
 // src/react/Lens.tsx
 var import_react12 = __toESM(require("react"), 1);
 var import_agentfootprint5 = require("agentfootprint");
-var import_flowchart5 = require("footprint-explainable-ui/flowchart");
 
 // src/react/lensNodeTypes.ts
 var import_flowchart3 = require("footprint-explainable-ui/flowchart");
@@ -3001,7 +3000,7 @@ var LensFlow = ({
     import_flowchart4.TracedFlow,
     {
       graph: chart.graph,
-      layout: chart.layout,
+      ...chart.layout && { layout: chart.layout },
       ...traceRuntimeOverlay && { overlay: traceRuntimeOverlay },
       ...scrubIndex !== void 0 && { scrubIndex },
       ...onNodeClick && { onNodeClick },
@@ -3158,7 +3157,8 @@ var TimeTravel = ({
   focusSeq,
   onFocusChange,
   isLive,
-  compact
+  compact,
+  stepStrip = true
 }) => {
   const max = Math.max(0, total - 1);
   const step = (delta) => {
@@ -3238,7 +3238,40 @@ var TimeTravel = ({
             children: isLive ? "\u25CF Live" : "\u27F3 Live"
           }
         ),
-        compact ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: { flex: 1 } }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: { flex: 1, position: "relative", display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        compact ? stepStrip && total > 1 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "div",
+          {
+            role: "group",
+            "aria-label": "Steps",
+            style: { flex: 1, display: "flex", alignItems: "center", gap: 2, minWidth: 120, padding: "0 4px" },
+            children: Array.from({ length: total }, (_, i) => {
+              const done = i < focusSeq;
+              const here = i === focusSeq;
+              return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+                "button",
+                {
+                  onClick: () => onFocusChange(i),
+                  disabled,
+                  title: `Step ${i + 1} / ${total}`,
+                  "aria-label": `Go to step ${i + 1}`,
+                  "aria-current": here ? "step" : void 0,
+                  style: {
+                    flex: 1,
+                    minWidth: 3,
+                    height: here ? 16 : 9,
+                    padding: 0,
+                    border: "none",
+                    borderRadius: 3,
+                    cursor: disabled ? "default" : "pointer",
+                    background: here ? T.warning : done ? T.success : T.border,
+                    transition: "height 0.12s ease, background 0.12s ease"
+                  }
+                },
+                i
+              );
+            })
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: { flex: 1 } }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: { flex: 1, position: "relative", display: "flex", alignItems: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
           "input",
           {
             type: "range",
@@ -5020,6 +5053,7 @@ var Lens = ({
   stepGraph,
   chart,
   view = "engineer",
+  stepStrip = true,
   humanizer,
   appName,
   commentaryTemplates,
@@ -5035,7 +5069,9 @@ var Lens = ({
       graph: structureGraphFromRunner(
         runner
       ),
-      layout: import_flowchart5.dagreTraceLayout,
+      // No `layout` → TracedFlow uses its built-in measure-then-layout
+      // pipeline (content-exact sizing + fork-centering + straight spines),
+      // and inherits every future eui layout improvement automatically.
       nodeTypes: LENS_NODE_TYPES
     } : void 0),
     [chart, runner]
@@ -5115,6 +5151,7 @@ var Lens = ({
       focusStep,
       onFocusChange: handleFocusChange,
       isLive,
+      stepStrip,
       liveStreamLine,
       drillPath,
       onDrillInto: drillInto,
@@ -5163,6 +5200,7 @@ var EngineerView = ({
   focusStep,
   onFocusChange,
   isLive,
+  stepStrip,
   liveStreamLine,
   drillPath,
   onDrillInto,
@@ -5430,6 +5468,7 @@ var EngineerView = ({
           TimeTravel,
           {
             compact: true,
+            stepStrip,
             total,
             focusSeq: focusStep,
             onFocusChange,
@@ -5557,7 +5596,7 @@ var EngineerView = ({
               /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
                 VLinePill,
                 {
-                  label: "Details",
+                  label: "Inspect",
                   expanded: rightExpanded,
                   side: "right",
                   onClick: () => setRightExpanded((v2) => !v2)
@@ -6350,7 +6389,6 @@ var Card = ({
 
 // src/react/Replay.tsx
 var import_react13 = require("react");
-var import_flowchart6 = require("footprint-explainable-ui/flowchart");
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var Replay = ({
   trace,
@@ -6361,7 +6399,8 @@ var Replay = ({
   const chart = (0, import_react13.useMemo)(
     () => trace.structure === void 0 ? void 0 : {
       graph: structureGraphFromSpec(trace.structure),
-      layout: import_flowchart6.dagreTraceLayout,
+      // No `layout` → use TracedFlow's built-in measure-then-layout pipeline
+      // (content-exact + fork-centering); inherits eui layout fixes for free.
       nodeTypes: LENS_NODE_TYPES
     },
     [trace.structure]