@reticlehq/browser 3.7.0 → 3.8.1

package/dist/presenter/presenter-settings.js

@@ -134,7 +134,10 @@ function settingsHelpIcon() {
 }
 const SETTING_TEXT = {
     outputDetail: ['Output detail', 'How much a copied run includes.'],
-    autoOpenChat: ['Open the log automatically', 'Opens this panel when a session starts.'],
+    autoOpenChat: [
+        'Open the log automatically',
+        'Opens this panel when an agent starts to act in this tab.',
+    ],
     showTimestamps: ['Show timestamps', 'Shows how long ago each log row happened.'],
     showTally: ['Show pass/fail count', 'A score pill for this session in the toolbar.'],
     reactComponents: ['React component names', 'Adds component names to copied runs.'],
@@ -144,10 +147,7 @@ const SETTING_TEXT = {
     ],
     clearOnCopy: ['Clear notes after copying', 'Starts fresh once your notes are copied.'],
     hideUntilRestart: ['Hide until reload', 'Hides the HUD until this page reloads.'],
-    harnessEnabled: [
-        'Allow Reticle to drive',
-        'Off by default. Unlocks at 80% instrumentation; lets Run Harness test this project.',
-    ],
+    harnessEnabled: ['Allow Reticle to drive', 'Off by default. Lets Run Harness test this project.'],
     reduceMotion: ['Reduce motion', 'Fewer HUD animations.'],
     ambientGlow: ['Page glow', 'Tints the page edges while a session runs.'],
     workspace: ['Workspace', 'The Reticle account this machine is signed in to.'],
@@ -184,7 +184,7 @@ export function creditsLeft(credits) {
     return creditsSpent(credits) ? creditsUsedText(credits).said : creditsLeftText(credits);
 }
 const ACCOUNT_HELP = `Whether this machine is signed in to a Reticle workspace. Press ${ACCOUNT_TEXT.SIGNED_OUT} to sign in through your browser.`;
-export function paintHarnessRow(root, config, gate) {
+export function paintHarnessRow(root, config) {
     const row = root.querySelector(`[${SETTINGS_HARNESS_ROW_ATTR}]`);
     if (!(row instanceof HTMLElement))
         return;
@@ -196,20 +196,17 @@ export function paintHarnessRow(root, config, gate) {
     const toggle = row.querySelector(`[${SETTING_KEY_ATTR}="harnessEnabled"]`);
     if (!(toggle instanceof HTMLElement))
         return;
-    const locked = gate !== undefined && !gate.unlocked ? gate.reason : undefined;
-    const usable = config.harnessEntitled && locked === undefined;
+    const usable = config.harnessEntitled;
     toggle.setAttribute('aria-checked', config.harnessEnabled && usable ? 'true' : 'false');
     toggle.setAttribute('aria-disabled', usable ? 'false' : 'true');
     const help = row.querySelector('[data-reticle-settings-help]');
     const credits = creditsLeft(config.credits);
     if (help instanceof HTMLElement)
-        help.title =
-            locked ??
-                (usable
-                    ? [HARNESS_HELP, credits].filter((t) => 0 < t.length).join(' ')
-                    : creditsSpent(config.credits)
-                        ? credits
-                        : HARNESS_LOCKED_HELP);
+        help.title = usable
+            ? [HARNESS_HELP, credits].filter((t) => 0 < t.length).join(' ')
+            : creditsSpent(config.credits)
+                ? credits
+                : HARNESS_LOCKED_HELP;
 }
 export function paintSettingsAccount(root, account, dashboardUrl, details = {}) {
     const row = root.querySelector(`[${SETTINGS_ACCOUNT_ROW_ATTR}]`);
@@ -502,11 +499,11 @@ export class PresenterSettingsPanel {
         applyPresenterSettings(root, activeSettings);
         this.#host.onSettingsChange?.(activeSettings);
     }
-    paintHarness(config, gate) {
+    paintHarness(config) {
         const root = this.#panel;
         if (root === undefined)
             return;
-        paintHarnessRow(root, config, gate);
+        paintHarnessRow(root, config);
     }
     teardown() {
         this.#root = undefined;

package/dist/presenter/presenter-shell.d.ts

@@ -1,5 +1,4 @@
-import type { AgentLink, HarnessConfig, HarnessDrive } from '@reticlehq/core';
-import type { HarnessGateView } from './presenter-harness-row.js';
+import type { AgentLink, HarnessConfig, HarnessDrive, LastDrive } from '@reticlehq/core';
 import { PresenterReport } from './presenter-report.js';
 import type { AccountState } from '@reticlehq/core';
 import { type AccountDetails } from './presenter-account.js';
@@ -23,9 +22,9 @@ interface HudShellCallbacks {
 export declare class HudShell {
     #private;
     setProjectId(projectId: string | undefined): void;
-    paintHarnessDrive(drive: HarnessDrive | undefined): void;
+    paintHarnessDrive(drive: HarnessDrive | undefined, last?: LastDrive): void;
     paintAgent(link: AgentLink | undefined): void;
-    paintHarness(config: HarnessConfig | undefined, gate?: HarnessGateView): void;
+    paintHarness(config: HarnessConfig | undefined): void;
     paintImpact(verdicts: number): void;
     paintAnnotations(items: readonly AnnotationItem[]): void;
     openView(view: ChatView): void;
@@ -50,5 +49,8 @@ export declare class HudShell {
 }
 export declare function wasMinimised(): boolean;
 export declare function rememberMinimised(minimised: boolean): void;
+export declare function wasLeftOpen(): boolean;
+export declare function rememberLeftOpen(open: boolean): void;
+export declare function shouldReopenPanel(): boolean;
 export declare function shouldAutoOpenChat(autoOpenChat: boolean): boolean;
 export {};

package/dist/presenter/presenter-shell.js

@@ -3,10 +3,10 @@ import { PresenterReport, reportPanelHtml } from './presenter-report.js';
 import { paintToolbarAccount, TOOLBAR_ACCOUNT_ATTR } from './presenter-workspace.js';
 import { mountAccountControl, TEAM_SLOT_ATTR } from './presenter-account.js';
 import { paintSettingsAccount } from './presenter-settings.js';
-import { CHAT_MIN_ATTR, CHAT_PILL_ATTR, REPORT_ATTR, ANNOTATE_BTN_ATTR, CHAT_ATTR, CHAT_TOGGLE_ATTR, CHAT_PANEL_ATTR, DOCK_ATTR, FAB_ATTR, MIN_ATTR, SETTINGS_ATTR, SETTINGS_BTN_ATTR, MINIMISED_STORAGE_KEY, } from './presenter-config.js';
+import { CHAT_MIN_ATTR, CHAT_PILL_ATTR, REPORT_ATTR, ANNOTATE_BTN_ATTR, CHAT_ATTR, CHAT_TOGGLE_ATTR, CHAT_PANEL_ATTR, DOCK_ATTR, FAB_ATTR, MIN_ATTR, SETTINGS_ATTR, SETTINGS_BTN_ATTR, MINIMISED_STORAGE_KEY, OPEN_STORAGE_KEY, } from './presenter-config.js';
 import { paintCarousel } from './carousel/carousel.js';
 import { panelSlides } from './carousel/panel-slides.js';
-import { paintRail, RAIL_HTML, RAIL_PROMO_ATTR } from './presenter-frame.js';
+import { paintRail, RAIL_HTML, RAIL_PROMO_ATTR, RAIL_SIGNIN_HTML } from './presenter-frame.js';
 import { FAB_TOGGLE_HTML, MARK_SVG } from './chrome/presenter-brand.js';
 import { settleLogAtLatest } from './chrome/presenter-log.js';
 import { installHudDragHandles, installHudPositionGuards } from './presenter-drag.js';
@@ -67,16 +67,16 @@ export class HudShell {
     setProjectId(projectId) {
         this.#chatViews.setProjectId(projectId);
     }
-    paintHarnessDrive(drive) {
-        this.#chatViews.paintDrive(drive);
+    paintHarnessDrive(drive, last) {
+        this.#chatViews.paintDrive(drive, last);
     }
     paintAgent(link) {
         this.#chatViews.paintAgent(link);
     }
-    paintHarness(config, gate) {
+    paintHarness(config) {
         this.#pushedHarness = config;
-        this.#settings.paintHarness(config, gate);
-        this.#chatViews.paintHarness(config, gate);
+        this.#settings.paintHarness(config);
+        this.#chatViews.paintHarness(config);
         this.#repaintPromoIfMoved();
     }
     #promoLinks() {
@@ -174,6 +174,7 @@ export class HudShell {
           <div class="${HUD_LOG_WELL_CLASS}"><div ${logAttr}></div></div>
           ${flowsHtml}
         </section>
+        ${RAIL_SIGNIN_HTML}
         ${footHtml}
       </div>
       ${FLOWS_PAGE_HTML}
@@ -270,12 +271,14 @@ export class HudShell {
         pillEl?.addEventListener('click', (e) => {
             e.preventDefault();
             e.stopPropagation();
+            rememberLeftOpen(true);
             this.showChat();
         }, { signal });
         const chatMinEl = root.querySelector(`[${CHAT_MIN_ATTR}]`);
         chatMinEl?.addEventListener('click', (e) => {
             e.preventDefault();
             e.stopPropagation();
+            rememberLeftOpen(false);
             this.closeChat();
         }, { signal });
         const collapseEl = root.querySelector('[data-reticle-min-btn]');
@@ -300,10 +303,12 @@ export class HudShell {
                 this.#suppressFabClick = false;
                 return;
             }
+            rememberLeftOpen(true);
             this.expand();
         }, { signal });
         this.#collapseBtn?.addEventListener('click', (e) => {
             e.stopPropagation();
+            rememberLeftOpen(false);
             this.collapse();
         }, { signal });
         const toolbarDrag = root.querySelector(`.${DRAG_HANDLE_CLASS}`);
@@ -455,6 +460,7 @@ export class HudShell {
             return;
         }
         if (this.isChatOpen()) {
+            rememberLeftOpen(false);
             this.closeChat();
             return;
         }
@@ -463,6 +469,7 @@ export class HudShell {
             return;
         }
         if (!this.isCollapsed()) {
+            rememberLeftOpen(false);
             this.collapse();
         }
     };
@@ -485,6 +492,29 @@ export function rememberMinimised(minimised) {
     catch {
     }
 }
+export function wasLeftOpen() {
+    try {
+        return '1' === globalThis.localStorage.getItem(OPEN_STORAGE_KEY);
+    }
+    catch {
+        return false;
+    }
+}
+export function rememberLeftOpen(open) {
+    try {
+        if (open) {
+            globalThis.localStorage.setItem(OPEN_STORAGE_KEY, '1');
+        }
+        else {
+            globalThis.localStorage.removeItem(OPEN_STORAGE_KEY);
+        }
+    }
+    catch {
+    }
+}
+export function shouldReopenPanel() {
+    return wasLeftOpen() && !wasMinimised();
+}
 export function shouldAutoOpenChat(autoOpenChat) {
     return autoOpenChat && !wasMinimised();
 }

package/dist/presenter/presenter.js

@@ -1,4 +1,4 @@
-import { ActionType, HudCorner, HudVisibility, HumanControlKind, ReticleCommand, PresenterMode, SessionState, isPresenterTone, isSessionState, } from '@reticlehq/core';
+import { ActionType, HudCorner, HudVisibility, HUD_RELOAD_TO_RESTORE, HumanControlKind, ReticleCommand, PresenterMode, SessionState, isPresenterTone, isSessionState, } from '@reticlehq/core';
 import { refs } from '../dom/addressing/refs.js';
 import { UNREACHABLE_HEADLINE, unreachableMessage } from '../transport/unreachable-message.js';
 import { actionVerb } from './chrome/presenter-verbs.js';
@@ -6,7 +6,7 @@ import { nativeSetTimeout, nativeClearTimeout, nativeNow } from '../timers/nativ
 import { LOG_KIND, CHIP_LABEL, LOG_ACTOR, DATA_RETICLE_LOG, clampLogMax, formatElapsed, humanDuration, appendLogRow, clearLogRows, trimLogRows, } from './chrome/presenter-log.js';
 import { PRESENTER_CSS } from './presenter-styles.js';
 import { HudShell } from './presenter-shell.js';
-import { HARNESS_LOG_ATTR, harnessGateIn } from './presenter-harness-row.js';
+import { HARNESS_LOG_ATTR } from './presenter-harness-row.js';
 import { platformDetails } from './presenter-account.js';
 import { parseImpactSnapshot } from './chrome/presenter-report-copy.js';
 import { scheduleSyncDockLayout } from './presenter-dock-layout.js';
@@ -20,7 +20,7 @@ import { renderTally } from './chrome/presenter-tally.js';
 import { CONTROLS_BANNER_HTML, CONTROLS_MARKS_HTML, CONTROLS_FOOT_HTML, CONTROLS_STATUS_HTML, ENDED_FADE_MS, ControlPanel, } from './presenter-controls.js';
 import { statusTheme, blockerHtml, getPresenterSettings, OutputDetail, syncPageBlocker, paintSdkVersion, } from './presenter-settings.js';
 import { Annotator } from '../review/annotator.js';
-import { shouldAutoOpenChat } from './presenter-shell.js';
+import { shouldAutoOpenChat, shouldReopenPanel } from './presenter-shell.js';
 import { installHudTelemetry } from './hud-telemetry.js';
 import { PlanBoard, parsePlanView } from './presenter-plan.js';
 import { claimLog, readRememberedLog, rememberLog, } from './chrome/log-memory.js';
@@ -56,6 +56,7 @@ export class Presenter {
     #endMs;
     #runLog = [];
     #sessionActive = false;
+    #agentOpened = false;
     #logMax;
     #log;
     #harnessLog;
@@ -70,6 +71,7 @@ export class Presenter {
     #panel;
     #shell;
     #annotator;
+    #removed = false;
     constructor(options = {}) {
         this.#paceMs = effectivePaceMs(options.paceMs);
         this.#now = options.now ?? nativeNow;
@@ -161,8 +163,8 @@ export class Presenter {
             if (snapshot !== undefined) {
                 this.#shell.report.setSnapshot(snapshot);
                 this.#shell.paintNotices(snapshot.notices);
-                this.#shell.paintHarness(snapshot.harnessConfig, harnessGateIn(snapshot.instrumentation, snapshot.harnessConfig));
-                this.#shell.paintHarnessDrive(snapshot.harnessDrive);
+                this.#shell.paintHarness(snapshot.harnessConfig);
+                this.#shell.paintHarnessDrive(snapshot.harnessDrive, snapshot.lastDrive);
                 this.#paintHarnessRun(snapshot.harnessDrive);
                 this.#shell.paintAgent(snapshot.agent);
                 this.#shell.paintImpact(snapshot.project.counts.verdicts);
@@ -201,7 +203,7 @@ export class Presenter {
         document.head.appendChild(style);
         const root = document.createElement('div');
         root.setAttribute('data-reticle-overlay', '');
-        const actStrip = `<div class="reticle-act-strip" data-liveness="idle"><span class="reticle-act-dot" aria-hidden="true"></span><span class="reticle-act">${ACT_STRIP.READY}</span>${CONTROLS_BANNER_HTML}<span class="reticle-chip" data-reticle-chip></span><div class="reticle-act-actions">${CONTROLS_STATUS_HTML}</div></div>`;
+        const actStrip = `<div class="reticle-act-strip" data-liveness="idle"><span class="reticle-act-dot" aria-hidden="true"></span><span class="reticle-act" data-reticle-act-line>${ACT_STRIP.READY}</span>${CONTROLS_BANNER_HTML}<span class="reticle-chip" data-reticle-chip></span><div class="reticle-act-actions">${CONTROLS_STATUS_HTML}</div></div>`;
         root.innerHTML = `
       ${blockerHtml()}
       <div data-reticle-glow></div>
@@ -340,7 +342,7 @@ export class Presenter {
         this.#showSession();
         this.#glowCtl.resetActivity(this.#now());
         this.#startHeartbeat();
-        if (shouldAutoOpenChat(getPresenterSettings().autoOpenChat)) {
+        if (shouldReopenPanel()) {
             this.#shell.openChat();
         }
     }
@@ -354,8 +356,9 @@ export class Presenter {
         this.#lastActionText = UNREACHABLE_HEADLINE;
         this.#paintActStrip(this.#lastActionText, true);
         this.#actLine?.setAttribute('title', unreachableMessage(url, attempts));
-        if (shouldAutoOpenChat(getPresenterSettings().autoOpenChat))
+        if (shouldReopenPanel()) {
             this.#shell.openChat();
+        }
     }
     #showSession() {
         const dock = this.#root?.querySelector('[data-reticle-dock]');
@@ -432,11 +435,15 @@ export class Presenter {
         this.#paintActStrip(text, false);
     }
     #paintHarnessRun(drive) {
+        const log = this.#harnessLog;
         if (drive !== undefined && drive.runId !== this.#harnessRunId) {
             this.#harnessRunId = drive.runId;
-            if (this.#harnessLog !== undefined)
-                clearLogRows(this.#harnessLog);
+            if (log !== undefined)
+                clearLogRows(log);
         }
+        if (log !== undefined && 0 === log.childElementCount)
+            for (const line of drive?.lines ?? [])
+                appendLogRow(log, LOG_KIND.NARRATION, line, '', this.#logMax, LOG_ACTOR.HARNESS);
         const was = this.#harnessSteps;
         this.#harnessSteps = drive?.steps;
         if (drive !== undefined)
@@ -507,10 +514,14 @@ export class Presenter {
     }
     placeHud(visibility, corner) {
         const root = this.#root;
-        if (root === undefined)
+        if (root === undefined) {
+            if (this.#removed)
+                return [HUD_RELOAD_TO_RESTORE];
             return [];
+        }
         const applied = [];
         if (HudVisibility.REMOVED === visibility) {
+            this.#removed = true;
             this.destroy();
             return [visibility];
         }
@@ -632,6 +643,7 @@ export class Presenter {
         while (this.#remembered.length > this.#logMax)
             this.#remembered.shift();
         rememberLog(this.#remembered);
+        this.#openForAgent(kind);
         if (this.#shell.isCollapsed())
             this.#shell.pulseFab(true);
         this.#renderTally();
@@ -645,6 +657,15 @@ export class Presenter {
             },
         };
     }
+    #openForAgent(kind) {
+        if (this.#agentOpened || LOG_KIND.HUMAN === kind) {
+            return;
+        }
+        this.#agentOpened = true;
+        if (shouldAutoOpenChat(getPresenterSettings().autoOpenChat)) {
+            this.#shell.openChat();
+        }
+    }
     #renderTally() {
         if (!getPresenterSettings().showTally) {
             this.#tally?.setAttribute('hidden', '');

package/dist/registry/store-adapters.d.ts

@@ -9,6 +9,7 @@ interface QueryLike {
             message?: string;
         } | null;
         data?: unknown;
+        isInvalidated?: boolean;
     };
     isStale?: () => boolean;
 }
@@ -23,16 +24,18 @@ export interface QuerySnapshot {
     status: string;
     fetchStatus: string | undefined;
     isStale: boolean | undefined;
+    isInvalidated: boolean | undefined;
     dataUpdatedAt: number | undefined;
     error: string | null;
     data: unknown;
 }
 export declare function tanstackQueryStore(client: QueryClientLike): StoreLike;
+type Deferred<T> = [T][T extends unknown ? 0 : never];
 interface JotaiStoreLike<A> {
     get: (atom: A) => unknown;
     sub: (atom: A, listener: () => void) => () => void;
 }
-export declare function jotaiStore<A>(store: JotaiStoreLike<A>, atoms: Record<string, A>): StoreLike;
+export declare function jotaiStore<A>(store: JotaiStoreLike<A>, atoms: Record<string, Deferred<A>>): StoreLike;
 interface ActorLike {
     getSnapshot: () => unknown;
     subscribe: (listener: () => void) => {
@@ -54,7 +57,7 @@ export interface RecoilAtomSnapshot {
     value: unknown;
     error: string | null;
 }
-export declare function recoilStore<A>(atoms: Record<string, A>, snapshot: () => RecoilSnapshotLike<A>, subscribe: StoreSubscribe): StoreLike;
+export declare function recoilStore<A>(atoms: Record<string, Deferred<A>>, snapshot: () => RecoilSnapshotLike<A>, subscribe: StoreSubscribe): StoreLike;
 interface SvelteReadable {
     subscribe: (run: (value: unknown) => void) => (() => void) | {
         unsubscribe: () => void;

package/dist/registry/store-adapters.js

@@ -9,37 +9,63 @@ function snapshotLive(value) {
     }
 }
 function copyPlain(value, seen) {
-    if ('object' !== typeof value || null === value)
+    if ('object' !== typeof value || null === value) {
         return value;
+    }
     const done = seen.get(value);
-    if (done !== undefined)
+    if (done !== undefined) {
         return done;
+    }
     if (Array.isArray(value)) {
         const out = [];
         seen.set(value, out);
-        for (const item of value)
+        for (const item of value) {
             out.push(copyPlain(item, seen));
+        }
         return out;
     }
     const proto = Object.getPrototypeOf(value);
-    if (proto !== Object.prototype && proto !== null)
+    if (proto !== Object.prototype && proto !== null) {
         return value;
+    }
     const out = {};
     seen.set(value, out);
-    for (const [key, item] of Object.entries(value))
+    for (const [key, item] of Object.entries(value)) {
         out[key] = copyPlain(item, seen);
+    }
     return out;
 }
+function queryKeyPart(part) {
+    if ('object' !== typeof part || null === part) {
+        return String(part);
+    }
+    return JSON.stringify(part, (_key, value) => {
+        if ('object' !== typeof value || null === value || Array.isArray(value)) {
+            return value;
+        }
+        const proto = Object.getPrototypeOf(value);
+        if (proto !== Object.prototype && proto !== null) {
+            return value;
+        }
+        const plain = value;
+        const sorted = {};
+        for (const key of Object.keys(plain).sort()) {
+            sorted[key] = plain[key];
+        }
+        return sorted;
+    });
+}
 export function tanstackQueryStore(client) {
     const store = {
         getState: () => {
             const out = {};
             for (const query of client.getQueryCache().getAll()) {
-                const key = query.queryKey.map((part) => String(part)).join('/');
+                const key = query.queryKey.map(queryKeyPart).join('/');
                 out[key] = {
                     status: query.state.status,
                     fetchStatus: query.state.fetchStatus,
                     isStale: query.isStale?.(),
+                    isInvalidated: query.state.isInvalidated,
                     dataUpdatedAt: query.state.dataUpdatedAt,
                     error: query.state.error?.message ?? null,
                     data: query.state.data,
@@ -56,15 +82,17 @@ export function jotaiStore(store, atoms) {
     return {
         getState: () => {
             const out = {};
-            for (const [name, atom] of Object.entries(atoms))
+            for (const [name, atom] of Object.entries(atoms)) {
                 out[name] = store.get(atom);
+            }
             return out;
         },
         subscribe: (listener) => {
             const unsubs = Object.values(atoms).map((atom) => store.sub(atom, listener));
             return () => {
-                for (const unsub of unsubs)
+                for (const unsub of unsubs) {
                     unsub();
+                }
             };
         },
     };
@@ -151,8 +179,9 @@ export function svelteStore(readable, warn = nativeWarn) {
         subscribe: (listener) => {
             let inSubscribeCall = true;
             const handle = readable.subscribe(() => {
-                if (!inSubscribeCall)
+                if (!inSubscribeCall) {
                     listener();
+                }
             });
             inSubscribeCall = false;
             return () => stopSubscription(handle);
@@ -177,8 +206,9 @@ export function pushStore(initial) {
         store: { getState: () => current, subscribe },
         push: (value) => {
             current = value;
-            for (const listener of listeners)
+            for (const listener of listeners) {
                 listener();
+            }
         },
     };
 }