waygraph 0.12.40 → 0.12.41

package/dist/cli.d.ts

@@ -4,7 +4,7 @@
  *
  * Primary verbs (less is more):
  *   auto   Explore picker; `.flow.ts` / `--blocks From To` = run that path
- *   demo   Watch (step overlay); `--blocks` `--data` `--auto-next` `--fast` `--full` `--ff-expand` `--ff-disabled`
+ *   demo   Watch (step overlay); `--blocks` `--data` `--auto-next` `--fast` `--full` `--mini` `--ff-expand` `--ff-disabled`
  *   run    Execute; `--blocks` `--data` `--non-headless` `--video`
  *
  * Also: list / nav / validate / check / graph / init / agent-dive / traverse / try

package/dist/cli.js

@@ -4,7 +4,7 @@
  *
  * Primary verbs (less is more):
  *   auto   Explore picker; `.flow.ts` / `--blocks From To` = run that path
- *   demo   Watch (step overlay); `--blocks` `--data` `--auto-next` `--fast` `--full` `--ff-expand` `--ff-disabled`
+ *   demo   Watch (step overlay); `--blocks` `--data` `--auto-next` `--fast` `--full` `--mini` `--ff-expand` `--ff-disabled`
  *   run    Execute; `--blocks` `--data` `--non-headless` `--video`
  *
  * Also: list / nav / validate / check / graph / init / agent-dive / traverse / try
@@ -1047,8 +1047,9 @@ async function installOverlay(page, title) {
         }
         if (iconLink.href !== favicon) iconLink.href = favicon;
         // Hide/Show for #wg-panel - call after every panel.innerHTML refresh.
-        // Collapsed title shows "N / M · block" (compact progress). forceCollapsed
-        // is for auto-next navs / video - does not overwrite the user's Hide preference.
+        // Collapsed title shows "N / M · block" (compact progress).
+        // forceCollapsed:true = force mini (--mini / --video). Omit otherwise so
+        // the user's Hide preference (localStorage) wins. Never pass false.
         window.__wgWirePanelChrome = (panel, storageKey, chromeTitle, opts) => {
           if (!panel) return;
           opts = opts || {};
@@ -1095,8 +1096,6 @@ async function installOverlay(page, title) {
           let hidden = false;
           if (opts.forceCollapsed === true) {
             hidden = true;
-          } else if (opts.forceCollapsed === false) {
-            hidden = false;
           } else {
             try {
               hidden = localStorage.getItem(storageKey) === "1";
@@ -1104,6 +1103,7 @@ async function installOverlay(page, title) {
               /* ignore */
             }
           }
+          // force mini does not overwrite Hide preference in storage.
           apply(hidden, opts.forceCollapsed === true ? false : true);
           const toggle = panel.querySelector("[data-wg-toggle]");
           if (toggle && !toggle.dataset.wgWired) {
@@ -1145,6 +1145,8 @@ async function renderBeforeStep(page, info) {
       if (window.__wgHideCursor) window.__wgHideCursor();
     })
     .catch(() => {});
+  // miniStepLabel is Node-only — compute before evaluate (browser has no closure).
+  const payload = { ...info, stepLabel: miniStepLabel(info) };
   await page
     .evaluate((info) => {
       // Reused in place, not removed + recreated, every step - the old
@@ -1277,8 +1279,8 @@ async function renderBeforeStep(page, info) {
       }
       if (window.__wgWirePanelChrome) {
         window.__wgWirePanelChrome(panel, "wg-panel-hidden", "waygraph demo", {
-          stepLabel: miniStepLabel(info),
-          forceCollapsed: info.forceCollapsed === true ? true : info.forceCollapsed === false ? false : undefined,
+          stepLabel: info.stepLabel || "",
+          forceCollapsed: info.forceCollapsed === true ? true : undefined,
         });
       }
       // Live, human-readable preview of what a MemKey's raw JSON will
@@ -1350,7 +1352,7 @@ async function renderBeforeStep(page, info) {
           if (auto) auto.style.display = cb.checked ? "" : "none";
         });
       }
-    }, info)
+    }, payload)
     .catch(() => {});
 }
 
@@ -1696,7 +1698,9 @@ async function renderAfterStep(page, info) {
   // 900ms / 200ms holds when set.
   await cycleHighlightRings(page, highlights, gatesFast, {
     pace: info.pace,
+    stepLabel: miniStepLabel(info),
   });
+  const afterPayload = { ...info, stepLabel: miniStepLabel(info) };
   await page
     .evaluate((info) => {
       // Reused in place - see renderBeforeStep's own comment on this.
@@ -1815,8 +1819,8 @@ async function renderAfterStep(page, info) {
       }
       if (window.__wgWirePanelChrome) {
         window.__wgWirePanelChrome(panel, "wg-panel-hidden", "waygraph demo", {
-          stepLabel: miniStepLabel(info),
-          forceCollapsed: info.forceCollapsed === true ? true : info.forceCollapsed === false ? false : undefined,
+          stepLabel: info.stepLabel || "",
+          forceCollapsed: info.forceCollapsed === true ? true : undefined,
         });
       }
       panel.querySelectorAll(".wg-toggle-btn").forEach((btn) => {
@@ -1845,7 +1849,7 @@ async function renderAfterStep(page, info) {
           if (auto) auto.style.display = cb.checked ? "" : "none";
         });
       }
-    }, info)
+    }, afterPayload)
     .catch(() => {});
 }
 
@@ -1857,6 +1861,7 @@ async function renderAfterStep(page, info) {
  */
 async function renderStepError(page, info) {
   await installOverlay(page, info.title);
+  const errorPayload = { ...info, stepLabel: miniStepLabel(info) };
   await page
     .evaluate((info) => {
       // Reused in place - see renderBeforeStep's own comment on this.
@@ -1917,15 +1922,15 @@ async function renderStepError(page, info) {
       }
       if (window.__wgWirePanelChrome) {
         window.__wgWirePanelChrome(panel, "wg-panel-hidden", "waygraph demo", {
-          stepLabel: miniStepLabel(info),
-          forceCollapsed: info.forceCollapsed === true ? true : info.forceCollapsed === false ? false : undefined,
+          stepLabel: info.stepLabel || "",
+          forceCollapsed: info.forceCollapsed === true ? true : undefined,
         });
       }
       const runBtn = document.getElementById("wg-run");
       if (runBtn) runBtn.addEventListener("click", () => window.__wgNext({}));
       const retryBtn = document.getElementById("wg-error-retry");
       if (retryBtn) retryBtn.addEventListener("click", () => window.__wgNext({ __wgRetry: "1" }));
-    }, info)
+    }, errorPayload)
     .catch(() => {});
 }
 
@@ -2168,7 +2173,9 @@ async function presentSlides(page, slides, _gate, opts) {
           panel = document.createElement("div");
           panel.id = "wg-panel";
         }
-        panel.classList.remove("wg-collapsed", "wg-error", "wg-expected");
+        panel.classList.remove("wg-error", "wg-expected");
+        // Do not clear wg-collapsed here - WirePanelChrome honors Hide (localStorage)
+        // unless forceCollapsed:true (--mini / --video).
         const esc = (t) =>
           String(t).replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/"/g, "&quot;");
         const episodeLine =
@@ -2247,7 +2254,8 @@ async function presentSlides(page, slides, _gate, opts) {
               " / " +
               info.total +
               (info.blockName ? " \\u00b7 " + info.blockName : ""),
-            forceCollapsed: false,
+            // Video / --mini stays on the mini stepper (Ep N · step · block pill).
+            forceCollapsed: info.forceCollapsed === true ? true : undefined,
           });
         }
         let autoNow = false;
@@ -2317,6 +2325,12 @@ async function presentSlides(page, slides, _gate, opts) {
         paceBadge: formatDemoPaceBadge(demoPace, baseAutoplay),
         paceLabel: formatDemoPaceLabel(demoPace, baseAutoplay),
         paceKind: demoPaceKind(demoPace),
+        forceCollapsed:
+          !!process.env.WAYGRAPH_VIDEO ||
+          process.env.WAYGRAPH_MINI === "1" ||
+          process.env.WAYGRAPH_STEPPER_MINI === "1"
+            ? true
+            : undefined,
       },
     );
     const started = Date.now();
@@ -3020,10 +3034,15 @@ async function runStepMode(engine, start, end, context, page, mem, resolved, slo
     const stubBeforeTodos = stubBeforePhase.todos || [];
     const isNavBlock = r.block.__waygraphKind === "nav";
     const autoNow = await currentAutoplay();
-    // Video recording: keep chrome compact. Live auto-next used to force-collapse
-    // every NavBlock and hid the stepper (todos / modules) - only collapse while
-    // act() runs (markStepRunning) so Playwright clicks hit the page, not the panel.
-    const forceCollapsed = !!process.env.WAYGRAPH_VIDEO;
+    // Video / --mini: compact "Ep N · step · block" pill only.
+    // Otherwise omit (undefined) so Hide/localStorage is honored - never pass false.
+    // WAYGRAPH_STEPPER_MINI=1 remains a compat env alias for WAYGRAPH_MINI.
+    const forceCollapsed =
+      !!process.env.WAYGRAPH_VIDEO ||
+      process.env.WAYGRAPH_MINI === "1" ||
+      process.env.WAYGRAPH_STEPPER_MINI === "1"
+        ? true
+        : undefined;
     const requires = r.block.requires ?? [];
     const keys = requires.map((k) => {
       let value = "<not yet set>";
@@ -3204,7 +3223,7 @@ async function runStepMode(engine, start, end, context, page, mem, resolved, slo
         episodeTitle: r.episodeTitle,
         expectedFailureReason: r.expectedFailureReason,
         stepperMode,
-        forceCollapsed: false,
+        // Omit forceCollapsed on errors so Hide preference is not stomped.
       });
       const errEdits = await gate();
       if (errEdits && errEdits.__wgRetry) {
@@ -3300,7 +3319,12 @@ async function runStepMode(engine, start, end, context, page, mem, resolved, slo
       episodeTitle: r.episodeTitle,
       stepperMode,
       todos: stubAfterTodos,
-      forceCollapsed: !!process.env.WAYGRAPH_VIDEO,
+      forceCollapsed:
+        !!process.env.WAYGRAPH_VIDEO ||
+        process.env.WAYGRAPH_MINI === "1" ||
+        process.env.WAYGRAPH_STEPPER_MINI === "1"
+          ? true
+          : undefined,
     });
     await gate();
   }
@@ -4315,6 +4339,9 @@ function parseRunFlags(argv) {
         else if (a === "--full") {
             out.fullStepper = true;
         }
+        else if (a === "--mini" || a === "--stepper-mini") {
+            out.miniStepper = true;
+        }
         else if (a === "--ff-expand") {
             out.ffExpand = true;
         }
@@ -4435,8 +4462,8 @@ function applyRunFlags(flags, opts) {
             process.env.WAYGRAPH_HEADED = "0";
         }
     }
-    if ((flags.fast || flags.fullStepper) && !opts?.allowDemoUi) {
-        console.error("waygraph: --fast / --full are demo-only flags");
+    if ((flags.fast || flags.fullStepper || flags.miniStepper) && !opts?.allowDemoUi) {
+        console.error("waygraph: --fast / --full / --mini are demo-only flags");
         process.exit(1);
     }
     if (flags.step === true) {
@@ -4480,6 +4507,9 @@ function applyRunFlags(flags, opts) {
     if (flags.fullStepper) {
         process.env.WAYGRAPH_STEPPER = "full";
     }
+    if (flags.miniStepper) {
+        process.env.WAYGRAPH_MINI = "1";
+    }
     if (flags.ffExpand) {
         process.env.WAYGRAPH_FF_EXPAND = "1";
     }
@@ -4644,6 +4674,7 @@ Primary (less is more):
                  --auto-next               Auto-advance steps (alias: --autoplay)
                  --fast                    Shorter auto-next / Next gates (keeps smooth cursor)
                  --full                    Classic wrap-all block chips (default: carousel)
+                 --mini                    Force compact mini panel (Hide pill); alias --stepper-mini
                  --ff-expand               Expand fastForwardComposeBlock inners as separate steps
                  --ff-disabled             Dispute: expand FF (alias --no-ff); blitz kept on those inners
                  --auto-play-video         Unattended + recorded: --auto-next + --video (+ step); headless by default
@@ -5038,7 +5069,7 @@ Agents shipped: waygraph-planner, waygraph-author, waygraph-healer.
                 console.error("waygraph demo: missing flow/spec — e.g.\n" +
                     "  waygraph demo src/flows/shop.flow.ts\n" +
                     "  waygraph demo --blocks shopFlow\n" +
-                    "  Flags: --blocks --data --auto-next --fast --full --ff-expand --ff-disabled --auto-play-video --title --base-url --video");
+                    "  Flags: --blocks --data --auto-next --fast --full --mini --ff-expand --ff-disabled --auto-play-video --title --base-url --video");
                 process.exit(1);
             }
             const proj = flags.blocks

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "waygraph",
-  "version": "0.12.40",
+  "version": "0.12.41",
   "type": "module",
   "description": "A typed graph of reusable Blocks for driving a browser through E2E flows.",
   "license": "MIT",