waygraph 0.15.54 → 0.16.0

package/dist/runner/inpage/banner.js

@@ -1,156 +0,0 @@
-// In-page installer (runs inside the browser via page.evaluate): must stay self-contained - no module-scope closure.
-// Split out of the former single installOverlay evaluate (see src/ARCHITECTURE.md). Shares state only via window.__wg*.
-/* eslint-disable no-unused-vars */
-export function installBanner({ title, favicon, bannerPos, todoPos, envAutoplay, todoDockUi, bannerUi, tag: bannerTag }) {
-        const POSITIONS = ["left", "center", "right"];
-        const applyPos = (el, pos) => {
-          el.dataset.pos = pos;
-          el.dataset.home = pos;
-          try {
-            localStorage.setItem("wg-banner-pos", pos);
-          } catch {
-            /* private mode / blocked storage - position still applies this page */
-          }
-        };
-        if (title) {
-          let banner = __wgById("wg-banner");
-          if (!banner) {
-            banner = document.createElement("div");
-            banner.id = "wg-banner";
-            let saved = null;
-            try {
-              saved = localStorage.getItem("wg-banner-pos");
-            } catch {
-              /* ignore */
-            }
-            const startPos =
-              saved && POSITIONS.includes(saved) ? saved : bannerPos;
-            applyPos(banner, startPos);
-            banner.title = "Click to move: top left / center / right";
-            banner.addEventListener("click", (e) => {
-              e.stopPropagation();
-              const i = POSITIONS.indexOf(banner.dataset.pos || "left");
-              applyPos(banner, POSITIONS[(i + 1) % POSITIONS.length]);
-            });
-            const tag = document.createElement("span");
-            tag.className = "wg-banner-tag";
-            tag.textContent = bannerTag || "waygraph demo";
-            const text = document.createElement("span");
-            text.className = "wg-banner-text";
-            text.textContent = title;
-            banner.appendChild(tag);
-            banner.appendChild(text);
-            __wgAdd(banner);
-          } else {
-            // Fixture / episode title changes every step - update in place
-            // (banner is created once; do not leave the first step's text stuck). Fades out/in
-            // instead of an instant swap, so a title change reads as a deliberate beat, not a
-            // flicker - opt-out (or re-tune) via bannerUi.captionFadeMs, 0 = instant.
-            let text = banner.querySelector(".wg-banner-text");
-            if (!text) {
-              text = document.createElement("span");
-              text.className = "wg-banner-text";
-              banner.appendChild(text);
-            }
-            if (text.textContent !== title) {
-              const fadeMs =
-                bannerUi && Number.isFinite(Number(bannerUi.captionFadeMs))
-                  ? Math.max(0, Number(bannerUi.captionFadeMs))
-                  : 220;
-              if (fadeMs <= 0 || !text.textContent) {
-                text.textContent = title;
-              } else {
-                text.style.transition = "opacity " + fadeMs + "ms ease";
-                text.style.opacity = "0";
-                setTimeout(() => {
-                  text.textContent = title;
-                  text.style.opacity = "1";
-                }, fadeMs);
-              }
-            }
-          }
-        }
-        // Authored banner UX (StubCtx.titlePos / bannerUi): applied every step, wins over click/env.
-        if (bannerUi) {
-          const cur = window.__wgBannerUi || {};
-          window.__wgBannerUi = { ...cur, ...bannerUi };
-        }
-        const bui = window.__wgBannerUi || {};
-        const bannerEl = __wgById("wg-banner");
-        if (bannerEl) {
-          if (bui.pos && POSITIONS.includes(bui.pos) && bannerEl.dataset.home !== bui.pos) {
-            bannerEl.dataset.pos = bui.pos;
-            bannerEl.dataset.home = bui.pos;
-            bannerEl.dataset.authored = "1";
-          }
-          bannerEl.dataset.collision = bui.collision === false ? "0" : "1";
-          bannerEl.style.display = bui.hidden ? "none" : "";
-        }
-        // Move the banner out of the way of a highlight ring (mirrors the todo dock's collision flip).
-        window.__wgBannerAvoidRing = (box) => {
-          const b = __wgById("wg-banner");
-          if (!b || !box || b.dataset.collision === "0" || b.style.display === "none") return;
-          const pad = 10;
-          const hits = () => {
-            const r = b.getBoundingClientRect();
-            return !(
-              r.right < box.x - pad ||
-              r.left > box.x + box.width + pad ||
-              r.bottom < box.y - pad ||
-              r.top > box.y + box.height + pad
-            );
-          };
-          const home = b.dataset.home || b.dataset.pos || "left";
-          // Called every animation frame while a ring is followed - only log when the outcome changes.
-          const log = (state, line) => {
-            if (b.dataset.lastLog === state) return;
-            b.dataset.lastLog = state;
-            if (line) (window.__wgBannerLog = window.__wgBannerLog || []).push(line);
-          };
-          b.dataset.pos = home;
-          if (!hits()) {
-            delete b.dataset.moved;
-            log("clear");
-            return;
-          }
-          for (const cand of POSITIONS.filter((p) => p !== home)) {
-            b.dataset.pos = cand;
-            if (!hits()) {
-              b.dataset.moved = home + ">" + cand;
-              log("moved:" + cand, "moved " + home + " -> " + cand + " (ring overlap)");
-              return;
-            }
-          }
-          b.dataset.pos = home;
-          b.dataset.moved = "none-free";
-          log("none-free", "overlap at every position (kept " + home + ")");
-        };
-        window.__wgBannerRestore = () => {
-          const b = __wgById("wg-banner");
-          if (!b) return;
-          if (b.dataset.home) b.dataset.pos = b.dataset.home;
-          delete b.dataset.moved;
-          delete b.dataset.lastLog;
-        };
-        // Dim the banner while a ring caption is the focus - same "auto opacity" effect the todo
-        // dock already has via __wgTodosSetBehind, extended to the banner so both floating chrome
-        // pieces step back the same way instead of only one of them fading.
-        window.__wgBannerSetBehind = (on) => {
-          const b = __wgById("wg-banner");
-          if (!b) return;
-          b.classList.toggle("wg-banner-behind", !!on);
-        };
-        // Tab title/favicon: a real navigation resets document.title and any
-        // <link rel="icon"> the new document brings, so re-check (not
-        // re-append) on every call instead of a one-time flag.
-        if (!document.title.startsWith("[waygraph] ")) {
-          document.title = "[waygraph] " + document.title;
-        }
-        let iconLink = document.querySelector("link[rel~='icon']");
-        if (!iconLink) {
-          iconLink = document.createElement("link");
-          iconLink.rel = "icon";
-          document.head.appendChild(iconLink);
-        }
-        if (iconLink.href !== favicon) iconLink.href = favicon;
-}

package/dist/runner/inpage/caption.d.ts

@@ -1,3 +0,0 @@
-/** In-page installer (page.evaluate target) - see caption.js's own header. */
-export function showCaption(text: string): void;
-export function hideCaption(): void;

package/dist/runner/inpage/caption.js

@@ -1,23 +0,0 @@
-// In-page installer (page.evaluate target) - must stay self-contained, no module-scope closure.
-// Bottom narration caption - a white rounded card, not the dark zsign-ported scrim this started as
-// (see ui/css/caption.css's own header); narration-timeline/TTS sync not ported yet.
-export function showCaption(text) {
-  let bar = __wgById("wg-caption-bar");
-  if (!bar) {
-    bar = document.createElement("div");
-    bar.id = "wg-caption-bar";
-    bar.setAttribute("data-wg-ui", "1");
-    const span = document.createElement("span");
-    span.className = "wg-caption-text";
-    bar.appendChild(span);
-    __wgAdd(bar);
-  }
-  const span = bar.querySelector(".wg-caption-text");
-  span.textContent = text;
-  bar.classList.add("wg-in");
-}
-
-export function hideCaption() {
-  const bar = __wgById("wg-caption-bar");
-  if (bar) bar.classList.remove("wg-in");
-}

package/dist/runner/inpage/core.d.ts

@@ -1,4 +0,0 @@
-/** In-page installer (page.evaluate target) - see core.js's own header. Installs the shared ring
- * primitive (__wgEnsureRingEl/__wgPaintRingAt), cursor, click-pulse, focus veil,
- * and the #wg-ring singleton every surface's "current action" ring uses. */
-export function installCore(args: Record<string, unknown>): void;

package/dist/runner/inpage/core.js

@@ -1,316 +0,0 @@
-// In-page installer (runs inside the browser via page.evaluate): must stay self-contained - no module-scope closure.
-// Split out of the former single installOverlay evaluate (see src/ARCHITECTURE.md). Shares state only via window.__wg*.
-/* eslint-disable no-unused-vars */
-export function installCore({ title, favicon, bannerPos, todoPos, envAutoplay, todoDockUi }) {
-        window.__wgTodoDockUi = todoDockUi || {
-          compact: true,
-          cap: 5,
-          expandCap: 14,
-          collision: true,
-          behindRing: true,
-        };
-        // Seed the live autoplay toggle from the env default on first ever
-        // load only - a real navigation re-runs this, and re-stamping here
-        // would silently undo a human's mid-run checkbox click.
-        try {
-          if (localStorage.getItem("wg-autoplay") === null) {
-            localStorage.setItem("wg-autoplay", envAutoplay ? "1" : "0");
-          }
-        } catch {
-          /* private mode / blocked storage - falls back to manual gating */
-        }
-        // The one shared ring primitive (ui/css/ring.css) - #wg-ring/#wg-ring-label is just this
-        // surface's OWN ring instance, found by id like any other (see __wgEnsureRingEl below).
-        window.__wgEnsureRingEl = (ringId, labelId) => {
-          let ring = __wgById(ringId);
-          if (!ring) {
-            ring = document.createElement("div");
-            ring.id = ringId;
-            ring.className = "wg-ring-el";
-            __wgAdd(ring);
-          }
-          let label = __wgById(labelId);
-          if (!label) {
-            label = document.createElement("div");
-            label.id = labelId;
-            label.className = "wg-ring-el-label";
-            __wgAdd(label);
-          }
-          return [ring, label];
-        };
-        /** Bare positioning only - no collision/follow/focus-veil (those are #wg-ring's own extras, see __wgPositionRing). */
-        window.__wgPaintRingAt = (ringId, labelId, box, label, tone, style) => {
-          const [ring, ringLabel] = window.__wgEnsureRingEl(ringId, labelId);
-          if (!box) return null;
-          const raw = (tone || "planned") + "";
-          const t =
-            raw === "auto" || raw === "info" || raw === "warning" || raw === "danger" || raw === "success" || raw === "orange"
-              ? raw
-              : "planned";
-          const st = style && typeof style === "object" ? style : {};
-          const sizeRaw = (st.size || "md") + "";
-          const size = sizeRaw === "sm" || sizeRaw === "lg" ? sizeRaw : "md";
-          const weightRaw = (st.weight || "normal") + "";
-          const weight = weightRaw === "bold" ? "bold" : "normal";
-          ring.dataset.tone = t;
-          ringLabel.dataset.tone = t;
-          ring.dataset.size = size;
-          ringLabel.dataset.size = size;
-          ringLabel.dataset.weight = weight;
-          if (st.color) ringLabel.style.color = st.color;
-          else ringLabel.style.removeProperty("color");
-          const pad = size === "sm" ? 3 : size === "lg" ? 10 : 6;
-          const margin = 6;
-          const vw = window.innerWidth;
-          const vh = window.innerHeight;
-          const left = box.x - pad;
-          const top = box.y - pad;
-          const width = Math.max(4, box.width + pad * 2);
-          const height = Math.max(4, box.height + pad * 2);
-          ring.style.left = left + "px";
-          ring.style.top = top + "px";
-          ring.style.width = width + "px";
-          ring.style.height = height + "px";
-          ring.style.opacity = "1";
-          if (labelId === "wg-ring-label") {
-            // The demo ring's caption is drawn from data-label (CSS ::after), not DOM text, so the page's own
-            // text selectors (getByText, text=...) never match waygraph's overlay twice.
-            ringLabel.dataset.label = label || "";
-            ringLabel.textContent = "";
-          } else {
-            ringLabel.textContent = label || "";
-          }
-          ringLabel.style.opacity = "1";
-          const lw = ringLabel.offsetWidth;
-          const lh = ringLabel.offsetHeight;
-          let labelLeft = left;
-          let labelTop = top + height + 8;
-          const aboveTop = top - lh - 8;
-          if (labelTop + lh > vh - margin) {
-            labelTop = aboveTop;
-          } else {
-            // Below the ringed box is often the NEXT form field in a tightly stacked list (e.g.
-            // saucedemo's checkout "First Name" / "Last Name" / "Zip" inputs) - a fixed +8px gap
-            // has no idea that's there and the label just sits on top of it. Sample a few points
-            // under the would-be label and flip above if any land on real page content (not our
-            // own ring/label elements, which are the only things expected there otherwise).
-            const probe = (x, y) => {
-              const el = document.elementFromPoint(x, y);
-              return el && el.id !== ringId && el.id !== labelId && !(el.closest && el.closest("#wg-root"));
-            };
-            const hitsPageContent =
-              probe(labelLeft + 2, labelTop + 2) ||
-              probe(labelLeft + lw - 2, labelTop + 2) ||
-              probe(labelLeft + 2, labelTop + lh - 2);
-            if (hitsPageContent && aboveTop >= margin) labelTop = aboveTop;
-          }
-          if (labelTop < margin) labelTop = margin;
-          if (labelLeft + lw > vw - margin) labelLeft = Math.max(margin, vw - margin - lw);
-          if (labelLeft < margin) labelLeft = margin;
-          ringLabel.style.left = labelLeft + "px";
-          ringLabel.style.top = labelTop + "px";
-          return [ring, ringLabel];
-        };
-        window.__wgEnsureRingEl("wg-ring", "wg-ring-label");
-        if (!__wgById("wg-cursor")) {
-          const cursor = document.createElement("div");
-          cursor.id = "wg-cursor";
-          // Dark fill + white stroke, same as help-center-clip-engine's own
-          // #clip-cursor - visible against any page background, light or
-          // dark, unlike a plain solid-white shape.
-          cursor.innerHTML =
-            "<svg viewBox='0 0 32 32' width='24' height='24'>" +
-            "<path fill='#0C0C1A' stroke='#fff' stroke-width='1.4' stroke-linejoin='round' " +
-            "d='M6 3.5l1.4 22.5 5.8-5.4 4.2 9.4 3.6-1.6-4.2-9.2H26z'/></svg>";
-          __wgAdd(cursor);
-        }
-        if (!__wgById("wg-click-pulse")) {
-          const pulse = document.createElement("div");
-          pulse.id = "wg-click-pulse";
-          __wgAdd(pulse);
-        }
-        window.__wgMoveCursorTo = (x, y, ms, instant) => {
-          const cursor = __wgById("wg-cursor");
-          if (!cursor) return;
-          cursor.style.setProperty("--wg-cursor-ms", (ms || 600) + "ms");
-          if (instant) {
-            const prev = cursor.style.transition;
-            cursor.style.transition = "none";
-            cursor.style.transform = "translate(" + x + "px," + y + "px)";
-            void cursor.offsetWidth;
-            cursor.style.transition = prev || "";
-          } else {
-            cursor.style.transform = "translate(" + x + "px," + y + "px)";
-          }
-          cursor.style.opacity = "1";
-        };
-        window.__wgHideCursor = () => {
-          const cursor = __wgById("wg-cursor");
-          if (cursor) cursor.style.opacity = "0";
-        };
-        // #wg-ring's own extras on top of the shared __wgPaintRingAt primitive: todo/banner
-        // collision avoidance only makes sense for the ONE "current action" ring, not Pilot's
-        // several independent fixture rings - kept here, not pushed down into the shared painter.
-        window.__wgPositionRing = (box, label, tone, style) => {
-          if (!box) return;
-          window.__wgPaintRingAt("wg-ring", "wg-ring-label", box, label, tone, style);
-          if (window.__wgTodosSetBehind) window.__wgTodosSetBehind(true);
-          if (window.__wgBannerSetBehind) window.__wgBannerSetBehind(true);
-          if (window.__wgTodosAvoidRingCollision) window.__wgTodosAvoidRingCollision(box);
-          if (window.__wgBannerAvoidRing) window.__wgBannerAvoidRing(box);
-        };
-        /** Dim/lower floating todo docks while a ring caption is the focus. */
-        window.__wgTodosSetBehind = (on) => {
-          const ui = window.__wgTodoDockUi || {};
-          if (ui.behindRing === false) {
-            __wgQA(".wg-todo-dock, #wg-todo-dock").forEach((el) => {
-              el.classList.remove("wg-todo-behind");
-            });
-            return;
-          }
-          __wgQA(".wg-todo-dock, #wg-todo-dock").forEach((el) => {
-            el.classList.toggle("wg-todo-behind", !!on);
-          });
-        };
-        /**
-         * If the active ring box intersects a todo dock, flip L/R once.
-         * Locked until hideRing so follow-rAF does not thrash.
-         */
-        window.__wgTodosAvoidRingCollision = (box) => {
-          const ui = window.__wgTodoDockUi || {};
-          if (ui.collision === false) return;
-          if (!box || window.__wgTodoCollisionLocked) return;
-          const pad = 10;
-          const rx1 = box.x - pad;
-          const ry1 = box.y - pad;
-          const rx2 = box.x + box.width + pad;
-          const ry2 = box.y + box.height + pad;
-          const overlaps = (el) => {
-            const r = el.getBoundingClientRect();
-            return !(r.right < rx1 || r.left > rx2 || r.bottom < ry1 || r.top > ry2);
-          };
-          const docks = [...__wgQA(".wg-todo-dock, #wg-todo-dock")].filter(
-            (el, i, arr) => arr.indexOf(el) === i,
-          );
-          for (const dock of docks) {
-            if (!overlaps(dock)) continue;
-            const cur = dock.dataset.pos === "right" ? "right" : "left";
-            dock.dataset.pos = cur === "right" ? "left" : "right";
-            try {
-              localStorage.setItem("wg-todo-pos", dock.dataset.pos);
-            } catch {
-              /* ignore */
-            }
-            // Still colliding after flip - tuck (shorter max-height).
-            if (overlaps(dock)) dock.dataset.tucked = "1";
-            else delete dock.dataset.tucked;
-            window.__wgTodoCollisionLocked = true;
-            break;
-          }
-        };
-        /** Live-follow a resolved element with rAF (accurate under device shell scale). */
-        window.__wgStopRingFollow = () => {
-          if (window.__wgRingFollowRaf) {
-            cancelAnimationFrame(window.__wgRingFollowRaf);
-            window.__wgRingFollowRaf = 0;
-          }
-          window.__wgRingFollowEl = null;
-        };
-        // `el` is a real DOM element (a Playwright ElementHandle unwrapped by evaluate() - see
-        // rings.js's showRing), not a selector string - >> piercing / :has-text() are Playwright's
-        // own selector-engine syntax, which document.querySelector has no way to understand, so
-        // resolution happens once on the Node side via page.locator(), before this ever runs.
-        window.__wgFollowRing = (el, label, tone, style, focus) => {
-          window.__wgStopRingFollow();
-          if (!el) return;
-          window.__wgRingFollowEl = el;
-          const tick = () => {
-            if (window.__wgRingFollowEl !== el) return;
-            if (!el.isConnected) {
-              window.__wgRingFollowRaf = requestAnimationFrame(tick);
-              return;
-            }
-            const r = el.getBoundingClientRect();
-            const box = { x: r.x, y: r.y, width: r.width, height: r.height };
-            if (window.__wgPositionRing) {
-              window.__wgPositionRing(box, label, tone || "planned", style || {});
-            }
-            if (focus && window.__wgApplyFocus) window.__wgApplyFocus(box);
-            window.__wgRingFollowRaf = requestAnimationFrame(tick);
-          };
-          tick();
-        };
-        window.__wgClickPulse = (x, y, tone) => {
-          const pulse = __wgById("wg-click-pulse");
-          if (!pulse) return;
-          const raw = (tone || "planned") + "";
-          pulse.dataset.tone =
-            raw === "auto" || raw === "info" || raw === "warning" || raw === "danger" || raw === "success"
-              ? raw
-              : "planned";
-          pulse.style.left = x + "px";
-          pulse.style.top = y + "px";
-          pulse.classList.remove("wg-pulse");
-          void pulse.offsetWidth;
-          pulse.classList.add("wg-pulse");
-        };
-        window.__wgHideRing = (opts) => {
-          // While a narrate() call owns the ring (mid multi-step action),
-          // the auto-highlight click/fill patches' own end-of-step hide is
-          // a no-op - narrate() itself clears it once the WHOLE wrapped
-          // action finishes, not just its first sub-step.
-          if (window.__wgNarrateOwnsRing) return;
-          if (window.__wgStopRingFollow) window.__wgStopRingFollow();
-          const ring = __wgById("wg-ring");
-          const ringLabel = __wgById("wg-ring-label");
-          if (ring) ring.style.opacity = "0";
-          if (ringLabel) ringLabel.style.opacity = "0";
-          if (window.__wgClearFocus) window.__wgClearFocus();
-          if (window.__wgTodosSetBehind) window.__wgTodosSetBehind(false);
-          if (window.__wgBannerSetBehind) window.__wgBannerSetBehind(false);
-          if (window.__wgBannerRestore) window.__wgBannerRestore();
-          window.__wgTodoCollisionLocked = false;
-          __wgQA(".wg-todo-dock[data-tucked], #wg-todo-dock[data-tucked]").forEach((el) => {
-            delete el.dataset.tucked;
-          });
-          // Honor zoomOut:false - keep camera until next zoom / desktop clear.
-          const forceClear = opts && opts.clearZoom === true;
-          const skipClear = opts && opts.clearZoom === false;
-          if (
-            !skipClear &&
-            (forceClear || window.__wgZoomOutOnHide !== false) &&
-            window.__wgClearZoom
-          ) {
-            window.__wgClearZoom();
-          }
-        };
-        window.__wgClearFocus = () => {
-          const veil = __wgById("wg-focus-veil");
-          if (!veil) return;
-          veil.classList.remove("wg-in");
-          setTimeout(() => {
-            const v = __wgById("wg-focus-veil");
-            if (v && !v.classList.contains("wg-in")) v.remove();
-          }, 320);
-        };
-        window.__wgApplyFocus = (box) => {
-          if (!box) {
-            if (window.__wgClearFocus) window.__wgClearFocus();
-            return;
-          }
-          let veil = __wgById("wg-focus-veil");
-          if (!veil) {
-            veil = document.createElement("div");
-            veil.id = "wg-focus-veil";
-            veil.setAttribute("data-wg-ui", "1");
-            __wgAdd(veil);
-          }
-          const pad = 10;
-          veil.style.left = Math.max(0, box.x - pad) + "px";
-          veil.style.top = Math.max(0, box.y - pad) + "px";
-          veil.style.width = Math.max(8, box.width + pad * 2) + "px";
-          veil.style.height = Math.max(8, box.height + pad * 2) + "px";
-          void veil.offsetWidth;
-          veil.classList.add("wg-in");
-        };
-}

package/dist/runner/inpage/device.d.ts

@@ -1,3 +0,0 @@
-/** In-page installer (page.evaluate target) - see device.js's own header. Args are accepted for
- * signature-consistency with the other inpage/* installers; only defines window.__wgSyncDevice. */
-export function installDevice(args: Record<string, unknown>): void;