@reticlehq/browser 2.13.1 → 2.14.0

package/dist/presenter/presenter-report-copy.js

@@ -1,49 +1,15 @@
 import { ImpactSnapshotSchema } from '@reticlehq/core';
-/**
- * What the report SAYS, kept away from how it looks.
- *
- * The wording here is the product's only claim about its own worth, so it is written once, in one
- * place, and tested. Two audiences, two registers:
- *
- *  - The REPORT is private. It is the user's own data, so it can carry everything, estimates
- *    included, as long as each estimate shows what it is measured against.
- *  - The SHARE card is public, and the research on developer stat-cards is blunt about what happens
- *    to a public card that leads with vendor savings: estimated token/time savings are the most
- *    mocked class of number in AI tooling (JetBrains measured ~10% against a viral 65% claim), and
- *    percentiles without a denominator get called misleading. So the card leads with what the
- *    user's own setup CAUGHT, and publishes its unknowns - the credibility move, and the thing a
- *    scoreboard would never do.
- */
-/** Reticle's own links, as they appear in the report footer. */
 export const REPORT_LINKS = {
     DOCS: 'https://docs.reticle.sh',
     SITE: 'https://reticle.sh',
     GITHUB: 'https://github.com/reticlehq/reticle',
     DISCORD: 'https://discord.gg/BwAbzv9ZRz',
 };
-/**
- * The X handle used for `via=` on a share.
- *
- * Empty until somebody who owns the account fills it in, and the share URL omits the parameter
- * while it is - a guessed handle credits a stranger, and there is no way for code to know.
- */
 export const SHARE_VIA_HANDLE = '';
 export const REPORT_TEXT = {
     TITLE: 'Impact',
     PROJECT: 'This project',
     GLOBAL: 'Everything on this machine',
-    /**
-     * What `counts.failed` actually is: a verdict whose declared consequence did not hold.
-     *
-     * It used to read "defects caught before you saw them", which overclaims in the one direction a
-     * verification tool must never overclaim. A failed verdict is not proof of a defect in the app —
-     * it is equally the shape of an assertion that was wrong. Measured in the field: an agent
-     * asserted a clean console on an app with ordinary dev-mode logging, the verdict went red, and
-     * the panel reported a defect nobody had found.
-     *
-     * The honest word is what Reticle DID: it refused to pass them. That is true of the assertion
-     * error and the real bug alike, and it still reads as the tool having done its job.
-     */
     HERO_DEFECTS: 'checks Reticle refused to pass',
     VERDICTS: 'Verdicts',
     PASSED: 'passed',
@@ -61,21 +27,14 @@ export const REPORT_TEXT = {
     ESTIMATE_TAG: 'estimate',
     CHART: 'Verdicts, last 30 days',
     DEFECTS: 'What broke',
-    DEFECTS_MORE: 'Manage all of them on the dashboard',
-    /**
-     * What an UNLINKED user is told, and the only place the product tells them.
-     *
-     * The dashboard link renders only when `dashboardUrl` exists, which means only once a repo is
-     * already linked — so the person most likely to want one, watching this record climb on their own
-     * machine, was never told it existed. The single mention anywhere else is a daemon log line.
-     *
-     * Stated as a FACT about where the record lives, not as a pitch. It sits at the foot of a panel
-     * somebody opened on purpose, so it informs rather than interrupts, and it appears only once
-     * there is a verdict worth keeping — an offer to preserve nothing is just an advert.
-     */
+    DEFECTS_MORE: 'Manage all of them on the dashboard — triage, assign, and push to GitHub',
+    DEFECT_LINK_TITLE: 'Open on the dashboard to triage or push to GitHub',
     LOCAL_ONLY: 'This record stops at this machine.',
     LOCAL_ONLY_ACTION: 'reticle login',
     LOCAL_ONLY_TAIL: 'keeps it, and lets a team see it.',
+    UNLINKED: 'Signed in, but this repo is not linked.',
+    UNLINKED_ACTION: 'reticle link',
+    UNLINKED_TAIL: 'sends this record to your workspace.',
     DEFECTS_NONE: 'Nothing has failed a declared consequence yet.',
     EMPTY: 'Nothing recorded yet. Drive the app once and this fills in.',
     SHARE: 'Share',
@@ -83,7 +42,6 @@ export const REPORT_TEXT = {
     COPIED: 'Copied',
     REFER: 'Send to a friend',
 };
-/** "4.2k", "1.3M" - a number a person reads at a glance rather than counts digits in. */
 export function compactNumber(n) {
     if (n < 1000)
         return String(Math.round(n));
@@ -94,7 +52,6 @@ export function compactNumber(n) {
 function trim(n) {
     return n >= 10 ? String(Math.round(n)) : String(Math.round(n * 10) / 10);
 }
-/** "2h 14m", "47m", "38s" - the same duration vocabulary the activity strip uses. */
 export function compactDuration(ms) {
     const s = Math.floor(ms / 1000);
     if (s < 60)
@@ -105,13 +62,6 @@ export function compactDuration(ms) {
     const h = Math.floor(m / 60);
     return 0 === m % 60 ? `${String(h)}h` : `${String(h)}h ${String(m % 60)}m`;
 }
-/**
- * The post itself.
- *
- * Leads with defects caught, then the verdict split INCLUDING unknowns, then the superlative. No
- * estimated savings, no percentile, no leaderboard: those are the four things the evidence says get
- * a dev-tool card mocked rather than shared.
- */
 export function buildShareText(scope, projectName) {
     const c = scope.counts;
     const where = projectName !== undefined && projectName.length > 0 ? ` on ${projectName}` : '';
@@ -127,29 +77,18 @@ export function buildShareText(scope, projectName) {
     }
     return lines.join('\n');
 }
-/** X share intent. `via` is omitted while no handle is configured. */
 export function buildXShareUrl(text) {
     const params = new URLSearchParams({ text, url: REPORT_LINKS.SITE });
     if (SHARE_VIA_HANDLE.length > 0)
         params.set('via', SHARE_VIA_HANDLE);
     return `https://twitter.com/intent/tweet?${params.toString()}`;
 }
-/**
- * LinkedIn share.
- *
- * `share-offsite` takes a url and NOTHING else - the title/summary parameters were deprecated in
- * 2018 and are ignored, so the caption has to reach the composer some other way. The report copies
- * it to the clipboard before opening this, which is the only path that works without asking the
- * user for posting permissions.
- */
 export function buildLinkedInShareUrl() {
     return `https://www.linkedin.com/sharing/share-offsite/?url=${encodeURIComponent(REPORT_LINKS.SITE)}`;
 }
-/** What a referral says: the tool, not the sender's numbers. */
 export function buildReferralText() {
     return `I have been verifying my agent's work from inside the running app with Reticle - it returns pass/fail with the file:line to fix. ${REPORT_LINKS.SITE}`;
 }
-/** Narrow an unknown push payload to a snapshot. Invalid shapes are ignored, never rendered. */
 export function parseImpactSnapshot(value) {
     const parsed = ImpactSnapshotSchema.safeParse(value);
     return parsed.success ? parsed.data : undefined;

package/dist/presenter/presenter-report-styles.d.ts

@@ -1,7 +1 @@
-/**
- * The impact report's surface.
- *
- * Same glass as the chat panel and anchored in the same slot above the toolbar, because it is the
- * same object seen a different way: what this session is doing, and what every session has done.
- */
 export declare const REPORT_CSS: string;

package/dist/presenter/presenter-report-styles.js

@@ -1,12 +1,6 @@
 import { HUD_DROP_SHADOW } from './presenter-hud-chrome.js';
 import { DOCK_ALIGN_ATTR, DOCK_ATTR, REPORT_ATTR, REPORT_PANEL_ATTR } from './presenter-config.js';
 const OVERLAY = 'data-reticle-overlay';
-/**
- * The impact report's surface.
- *
- * Same glass as the chat panel and anchored in the same slot above the toolbar, because it is the
- * same object seen a different way: what this session is doing, and what every session has done.
- */
 export const REPORT_CSS = `
 [${REPORT_PANEL_ATTR}]{
   position:absolute;right:0;left:auto;bottom:calc(100% + 12px);z-index:31;
@@ -88,6 +82,12 @@ export const REPORT_CSS = `
 [${REPORT_PANEL_ATTR}] .reticle-report-defect-source{
   color:var(--reticle-faint);font-size:9.5px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
   overflow-wrap:anywhere;}
+.reticle-report-defect-link{flex:none;display:inline-flex;align-items:center;justify-content:center;
+  width:20px;height:20px;border-radius:6px;color:var(--reticle-faint);pointer-events:auto;
+  opacity:0;transition:opacity .12s ease,color .12s ease,background .12s ease;}
+.reticle-report-defect:hover .reticle-report-defect-link,
+.reticle-report-defect-link:focus-visible{opacity:1;}
+.reticle-report-defect-link:hover{color:var(--reticle-fg);background:rgba(255,255,255,.07);}
 [${REPORT_PANEL_ATTR}] .reticle-report-defects-more{
   display:inline-block;margin-top:8px;font-size:10px;color:var(--reticle-c-active);
   text-decoration:none;}

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

@@ -1,16 +1,13 @@
-import { type ImpactScope, type ImpactSnapshot } from '@reticlehq/core';
+import { type AccountState, type ImpactScope, type ImpactSnapshot } from '@reticlehq/core';
 export declare function reportPanelHtml(): string;
-export declare function reportBodyHtml(scope: ImpactScope, dashboardUrl?: string): string;
-export interface ReportHost {
-    /** Opened from the toolbar and from the chat, so the shell decides what else must close. */
+export declare function reportBodyHtml(scope: ImpactScope, dashboardUrl?: string, account?: AccountState): string;
+interface ReportHost {
     onBeforeOpen?: () => void;
 }
-/** The report panel controller: scope toggle, live repaint, share + referral actions. */
 export declare class PresenterReport {
     #private;
     constructor(host?: ReportHost);
     mount(root: HTMLElement): void;
-    /** The record arrived from the daemon. Repaint only if the panel is on screen. */
     setSnapshot(snapshot: ImpactSnapshot): void;
     snapshot(): ImpactSnapshot | undefined;
     isOpen(): boolean;
@@ -18,6 +15,6 @@ export declare class PresenterReport {
     close(): void;
     toggle(): void;
     contains(node: Node): boolean;
-    /** The post text for whichever scope is showing. */
     shareText(): string;
 }
+export {};

package/dist/presenter/presenter-report.js

@@ -1,14 +1,8 @@
-import { IMPACT_DEFECT_LIMIT } from '@reticlehq/core';
+import { IMPACT_DEFECT_LIMIT, } from '@reticlehq/core';
 import { PresenterIcon, PRESENTER_ICON_SIZE, hiIconHtml } from './presenter-icons.js';
 import { HUD_SURFACE_CLASS } from './presenter-hud-chrome.js';
 import { REPORT_PANEL_ATTR, REPORT_ATTR, REPORT_CLOSE_ATTR } from './presenter-config.js';
 import { REPORT_LINKS, REPORT_TEXT, buildLinkedInShareUrl, buildReferralText, buildShareText, buildXShareUrl, compactDuration, compactNumber, } from './presenter-report-copy.js';
-/**
- * The impact report: what Reticle has actually done for this user.
- *
- * Reads the local record only - the panel is a view over `.reticle/impact.json`, pushed by the
- * daemon, never fetched from us. Two scopes (this project, this machine) behind one toggle.
- */
 const SCOPE_ATTR = 'data-reticle-report-scope';
 const SHARE_X_ATTR = 'data-reticle-share-x';
 const SHARE_IN_ATTR = 'data-reticle-share-in';
@@ -17,7 +11,7 @@ const REFER_ATTR = 'data-reticle-refer';
 const COPIED_FLASH_MS = 1600;
 export function reportPanelHtml() {
     const close = hiIconHtml(PresenterIcon.REMOVE, PRESENTER_ICON_SIZE.MIN);
-    return `<div ${REPORT_PANEL_ATTR} class="reticle-report ${HUD_SURFACE_CLASS}" role="dialog" aria-label="Reticle impact" aria-hidden="true">
+    return `<div ${REPORT_PANEL_ATTR} class="reticle-report ${HUD_SURFACE_CLASS}" role="region" aria-label="Reticle impact" aria-hidden="true">
     <div class="reticle-report-inner">
       <div class="reticle-report-head">
         <span class="reticle-report-title">${REPORT_TEXT.TITLE}</span>
@@ -40,19 +34,12 @@ export function reportPanelHtml() {
     </div>
   </div>`;
 }
-/** A stat card: the number, what it is, and - for an estimate - what it is measured against. */
 function card(value, label, basis) {
     const tag = basis === undefined
         ? ''
         : `<span class="reticle-report-basis" title="${basis}">${REPORT_TEXT.ESTIMATE_TAG}</span>`;
     return `<div class="reticle-report-card"><span class="reticle-report-value">${value}</span><span class="reticle-report-label">${label}${tag}</span></div>`;
 }
-/**
- * A 30-day bar chart of verdicts, as inline spans.
- *
- * Bars rather than a line: a day with no verdicts is a real fact about the week, and a line chart
- * interpolates straight through it.
- */
 function chart(scope) {
     const days = scope.days.slice(-30);
     if (0 === days.length)
@@ -68,14 +55,6 @@ function chart(scope) {
         .join('');
     return `<div class="reticle-report-chart-wrap"><span class="reticle-report-section">${REPORT_TEXT.CHART}</span><div class="reticle-report-chart">${bars}</div></div>`;
 }
-/**
- * Escape text that came from the app under test.
- *
- * A defect title is an element's accessible name or a verdict's failure reason — both of which are
- * ultimately the CONTENT of somebody else's page, and this panel builds its DOM from an HTML string.
- * Everything else the report renders is a number or a date; this is the first app-derived text to
- * reach it, so the escaping arrives with it.
- */
 function esc(value) {
     return value
         .replace(/&/g, '&amp;')
@@ -83,46 +62,23 @@ function esc(value) {
         .replace(/>/g, '&gt;')
         .replace(/"/g, '&quot;');
 }
-/**
- * The short list of what is currently broken.
- *
- * The hero number already says HOW MANY defects Reticle caught; this says WHICH ONES, which is the
- * difference between a statistic and something a person can act on. Deliberately short: a panel in
- * the corner of somebody's app is not a triage queue, and the link at the bottom is where the queue
- * lives. When the project is not linked to a workspace there is no link and no nagging — the free
- * tool is complete on its own.
- */
-/**
- * Whether a dashboard link is safe to render as a clickable href.
- *
- * The url arrives from `.reticle/cloud.json` — a file in somebody's repository, which means it is
- * INPUT. Escaping the quotes stops it breaking out of the attribute but does nothing about the
- * SCHEME, so `javascript:...` produced a link that ran code inside the developer's own application,
- * from a panel Reticle injected there. Only the two schemes a dashboard can actually live on are
- * allowed; anything else renders no link at all, which is the same state as an unlinked project and
- * therefore already a supported one.
- */
 function isSafeDashboardUrl(raw) {
     try {
         const scheme = new URL(raw).protocol;
         return 'https:' === scheme || 'http:' === scheme;
     }
     catch {
-        // Not a url at all. A relative path cannot address a dashboard on another origin, so there is
-        // nothing to render and nothing lost by refusing it.
         return false;
     }
 }
 function defects(scope, dashboardUrl) {
-    /*
-     * Defaulted here as well as in the schema. Zod's default applies when a record is PARSED, and the
-     * snapshot reaching this panel is pushed straight from the daemon rather than round-tripped
-     * through the schema — so a record written by an older build arrives with no `defects` field at
-     * all and used to throw, taking the whole report down with it.
-     */
     const list = (scope.defects ?? []).slice(0, IMPACT_DEFECT_LIMIT);
     if (0 === list.length)
         return '';
+    const linked = dashboardUrl !== undefined && isSafeDashboardUrl(dashboardUrl);
+    const rowLink = linked
+        ? `<a class="reticle-report-defect-link" href="${esc(dashboardUrl)}" target="_blank" rel="noreferrer noopener" title="${REPORT_TEXT.DEFECT_LINK_TITLE}" aria-label="${REPORT_TEXT.DEFECT_LINK_TITLE}">${hiIconHtml(PresenterIcon.VIEW, PRESENTER_ICON_SIZE.SEND)}</a>`
+        : '';
     const rows = list
         .map((d) => {
         const detail = d.detail === undefined
@@ -131,17 +87,15 @@ function defects(scope, dashboardUrl) {
         const source = d.source === undefined
             ? ''
             : `<span class="reticle-report-defect-source">${esc(d.source)}</span>`;
-        return `<li class="reticle-report-defect"><span class="reticle-report-defect-title">${esc(d.title)}</span>${detail}${source}</li>`;
+        return `<li class="reticle-report-defect"><span class="reticle-report-defect-title">${esc(d.title)}</span>${detail}${source}${rowLink}</li>`;
     })
         .join('');
-    // Only claim there are more when there actually are — `counts.failed` is every defect ever, and
-    // this list is the recent tail of it.
-    const more = dashboardUrl === undefined || !isSafeDashboardUrl(dashboardUrl)
+    const more = !linked
         ? ''
         : `<a class="reticle-report-defects-more" href="${esc(dashboardUrl)}" target="_blank" rel="noreferrer noopener">${REPORT_TEXT.DEFECTS_MORE}${scope.counts.failed > list.length ? ` (${String(scope.counts.failed)})` : ''}</a>`;
     return `<div class="reticle-report-defects-wrap"><span class="reticle-report-section">${REPORT_TEXT.DEFECTS}</span><ul class="reticle-report-defects">${rows}</ul>${more}</div>`;
 }
-export function reportBodyHtml(scope, dashboardUrl) {
+export function reportBodyHtml(scope, dashboardUrl, account) {
     const c = scope.counts;
     if (0 === c.calls)
         return `<p class="reticle-report-empty">${REPORT_TEXT.EMPTY}</p>`;
@@ -164,27 +118,20 @@ export function reportBodyHtml(scope, dashboardUrl) {
         card(compactNumber(scope.savings.tokens.value), REPORT_TEXT.SAVED_TOKENS, scope.savings.tokens.basis),
         card(compactDuration(scope.savings.minutes.value * 60_000), REPORT_TEXT.SAVED_MINUTES, scope.savings.minutes.basis),
     ].join('');
-    return `${streak}${hero}${verdicts}<div class="reticle-report-grid">${cards}</div>${defects(scope, dashboardUrl)}${chart(scope)}${localOnly(scope, dashboardUrl)}`;
+    return `${streak}${hero}${verdicts}<div class="reticle-report-grid">${cards}</div>${defects(scope, dashboardUrl)}${chart(scope)}${localOnly(scope, dashboardUrl, account)}`;
 }
-/**
- * The one line an UNLINKED user is shown about the dashboard.
- *
- * Absent `dashboardUrl` IS the unlinked signal — it is only ever set from a repo's cloud.json — so
- * this needs no new plumbing and cannot be wrong about the state it describes.
- *
- * Gated on a VERDICT, not on tool calls. Somebody who has driven the app but proved nothing has not
- * yet received the thing this offers to preserve, and offering to keep nothing is an advert. Past
- * that bar it is a fact about where their record lives, at the foot of a panel they opened on
- * purpose — which is why it does not need to be dismissible.
- */
-function localOnly(scope, dashboardUrl) {
+function localOnly(scope, dashboardUrl, account) {
     if (dashboardUrl !== undefined)
         return '';
     if (scope.counts.verdicts <= 0)
         return '';
-    return `<p class="reticle-report-local-only">${REPORT_TEXT.LOCAL_ONLY} <code>${REPORT_TEXT.LOCAL_ONLY_ACTION}</code> ${REPORT_TEXT.LOCAL_ONLY_TAIL}</p>`;
+    if (account === undefined)
+        return '';
+    const [lead, action, tail] = account.signedIn
+        ? [REPORT_TEXT.UNLINKED, REPORT_TEXT.UNLINKED_ACTION, REPORT_TEXT.UNLINKED_TAIL]
+        : [REPORT_TEXT.LOCAL_ONLY, REPORT_TEXT.LOCAL_ONLY_ACTION, REPORT_TEXT.LOCAL_ONLY_TAIL];
+    return `<p class="reticle-report-local-only">${lead} <code>${action}</code> ${tail}</p>`;
 }
-/** The report panel controller: scope toggle, live repaint, share + referral actions. */
 export class PresenterReport {
     #panel;
     #body;
@@ -217,8 +164,6 @@ export class PresenterReport {
         });
         root.querySelector(`[${SHARE_IN_ATTR}]`)?.addEventListener('click', (e) => {
             e.stopPropagation();
-            // LinkedIn ignores every text parameter, so the caption goes to the clipboard first and the
-            // composer opens on the link - the only route that needs no posting permission.
             void this.#copy(this.shareText());
             this.#openShare(buildLinkedInShareUrl());
         });
@@ -231,7 +176,6 @@ export class PresenterReport {
             void this.#copy(buildReferralText(), e.currentTarget);
         });
     }
-    /** The record arrived from the daemon. Repaint only if the panel is on screen. */
     setSnapshot(snapshot) {
         this.#snapshot = snapshot;
         if (this.isOpen())
@@ -264,7 +208,6 @@ export class PresenterReport {
     contains(node) {
         return true === this.#panel?.contains(node);
     }
-    /** The post text for whichever scope is showing. */
     shareText() {
         const snap = this.#snapshot;
         if (snap === undefined)
@@ -286,7 +229,7 @@ export class PresenterReport {
         this.#body.innerHTML =
             scope === undefined
                 ? `<p class="reticle-report-empty">${REPORT_TEXT.EMPTY}</p>`
-                : reportBodyHtml(scope, this.#snapshot?.dashboardUrl);
+                : reportBodyHtml(scope, this.#snapshot?.dashboardUrl, this.#snapshot?.account);
     }
     #openShare(url) {
         window.open(url, '_blank', 'noopener,noreferrer');
@@ -296,7 +239,6 @@ export class PresenterReport {
             await navigator.clipboard?.writeText(text);
         }
         catch {
-            // A blocked clipboard is not worth an error dialog over; the text is on screen either way.
         }
         if (button instanceof HTMLElement) {
             const original = button.textContent ?? '';

package/dist/presenter/presenter-run-state.d.ts

@@ -1,7 +1,6 @@
 import { SessionState } from '@reticlehq/core';
 import { type LogKind, type LogResult } from './presenter-log.js';
 import { type Capabilities } from '../registry/capabilities.js';
-/** The in-page run-state export (Copy/Export buttons). The full event ring-buffer is server-side. */
 export interface PresenterRunState {
     session: string;
     url: string;
@@ -24,7 +23,6 @@ export interface PresenterRunState {
         result?: LogResult;
     }[];
 }
-/** Everything the controller hands the builder - the live fields a run state is computed from. */
 interface RunStateInput {
     sessionId: string;
     state: SessionState;
@@ -38,10 +36,5 @@ interface RunStateInput {
         result?: LogResult;
     }[];
 }
-/**
- * Compute the exported run-state from the controller's live fields: per-kind + pass/fail counts over
- * the activity log, the session duration, and the current capability surface. Extracted from
- * presenter.ts so the controller stays under the size cap; the counting is the same as before.
- */
 export declare function buildRunState(input: RunStateInput): PresenterRunState;
 export {};

package/dist/presenter/presenter-run-state.js

@@ -1,11 +1,6 @@
 import { SessionState } from '@reticlehq/core';
 import { LOG_KIND, LOG_RESULT } from './presenter-log.js';
 import { getCapabilities } from '../registry/capabilities.js';
-/**
- * Compute the exported run-state from the controller's live fields: per-kind + pass/fail counts over
- * the activity log, the session duration, and the current capability surface. Extracted from
- * presenter.ts so the controller stays under the size cap; the counting is the same as before.
- */
 export function buildRunState(input) {
     const start = input.startMs ?? input.now;
     const counts = { reads: 0, acts: 0, narrations: 0, human: 0, passes: 0, fails: 0 };

package/dist/presenter/presenter-settings-styles.d.ts

@@ -1,2 +1 @@
-/** Compact settings card - dock-anchored above the HUD pill. */
 export declare const SETTINGS_CSS: string;

package/dist/presenter/presenter-settings-styles.js

@@ -1,6 +1,5 @@
 import { SETTINGS_PANEL_ATTR, SETTINGS_ATTR, DOCK_ATTR, DOCK_ALIGN_ATTR, SETTINGS_PLACEMENT_ATTR, } from './presenter-config.js';
 import { HUD_DROP_SHADOW, HUD_SURFACE_CLASS, HUD_SURFACE_PAINT } from './presenter-hud-chrome.js';
-/** Compact settings card - dock-anchored above the HUD pill. */
 export const SETTINGS_CSS = `
 [${'data-reticle-overlay'}][${SETTINGS_ATTR}="1"] [${'data-reticle-chat-panel'}]{
   display:none !important;visibility:hidden !important;pointer-events:none !important;}

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

@@ -1,20 +1,11 @@
 import { SETTINGS_CSS } from './presenter-settings-styles.js';
 export { SETTINGS_CSS };
-/** How much detail lands in copied/exported run state. */
 export declare const OutputDetail: {
     readonly MINIMAL: "minimal";
     readonly STANDARD: "standard";
     readonly VERBOSE: "verbose";
 };
 export type OutputDetail = (typeof OutputDetail)[keyof typeof OutputDetail];
-/**
- * Status themes: ONE choice, three colours.
- *
- * This was four separate pickers - a chrome accent plus a swatch row per state - which is 28
- * decisions to land on a set that works together. A theme is a combination we have already checked
- * reads as a progression (working -> waiting -> done) and against a dark app, so the choice is
- * "which mood", not "which four hex values".
- */
 export declare const StatusThemeId: {
     readonly SIGNAL: "signal";
     readonly TRAFFIC: "traffic";
@@ -23,7 +14,7 @@ export declare const StatusThemeId: {
     readonly EMBER: "ember";
 };
 export type StatusThemeId = (typeof StatusThemeId)[keyof typeof StatusThemeId];
-export interface StatusTheme {
+interface StatusTheme {
     id: StatusThemeId;
     label: string;
     active: string;
@@ -34,13 +25,7 @@ export declare const STATUS_THEMES: readonly StatusTheme[];
 export declare function statusTheme(id: StatusThemeId): StatusTheme;
 export interface PresenterSettings {
     outputDetail: OutputDetail;
-    /**
-     * The colours the HUD signals session state with - the dot, the panel wash, the page glow, the
-     * FAB halo and the annotation marks all read from whichever one is current. One choice, because
-     * the three have to work as a set and against the user's own app.
-     */
     statusThemeId: StatusThemeId;
-    /** The page-edge glow. Off leaves every other signal (dot, panel, FAB) in place. */
     ambientGlow: boolean;
     reactComponents: boolean;
     hideUntilRestart: boolean;
@@ -53,21 +38,14 @@ export interface PresenterSettings {
 }
 export declare function getPresenterSettings(): PresenterSettings;
 export declare function loadPresenterSettings(): PresenterSettings;
-/** Settings panel markup - anchored above the gear in the toolbar. */
 export declare function settingsPanelHtml(): string;
 export interface SettingsHost {
     onHideUntilRestart?: () => void;
     onSettingsChange?: (settings: PresenterSettings) => void;
     onBeforeOpen?: () => void;
 }
-/** Apply persisted settings onto the overlay + dock. */
 export declare function applyPresenterSettings(root: HTMLElement, settings: PresenterSettings): void;
-/**
- * Toggle the full-page blocker. Only active while annotate mode is live AND the user opted in -
- * never on a collapsed FAB, so real hover/click on the host app still works.
- */
 export declare function syncPageBlocker(root: HTMLElement, settings: PresenterSettings, annotateLive: boolean): void;
-/** Blocker node - sits under Reticle UI, above the host page. */
 export declare function blockerHtml(): string;
 export declare class PresenterSettingsPanel {
     #private;

package/dist/presenter/presenter-settings.js

@@ -5,20 +5,11 @@ import { resetHudDockPosition } from './presenter-drag.js';
 import { findDock, scheduleSyncDockLayout } from './presenter-dock-layout.js';
 import { SETTINGS_CSS } from './presenter-settings-styles.js';
 export { SETTINGS_CSS };
-/** How much detail lands in copied/exported run state. */
 export const OutputDetail = {
     MINIMAL: 'minimal',
     STANDARD: 'standard',
     VERBOSE: 'verbose',
 };
-/**
- * Status themes: ONE choice, three colours.
- *
- * This was four separate pickers - a chrome accent plus a swatch row per state - which is 28
- * decisions to land on a set that works together. A theme is a combination we have already checked
- * reads as a progression (working -> waiting -> done) and against a dark app, so the choice is
- * "which mood", not "which four hex values".
- */
 export const StatusThemeId = {
     SIGNAL: 'signal',
     TRAFFIC: 'traffic',
@@ -70,14 +61,6 @@ const DEFAULT_SETTINGS = {
     blockPageInteractions: true,
     showTally: false,
     showTimestamps: true,
-    // ON by default: the chat IS the HUD's content, and shipping it off meant the default experience
-    // was a bare toolbar until somebody found the toggle. `expand()` has always opened the chat for
-    // the same reason; this is the other half — session start, with no click at all.
-    //
-    // Safe to default because `openChat()` expands a collapsed HUD, and session start is the one
-    // moment where that is what you want. A user who prefers the bare toolbar turns this off and it
-    // stays off: a stored `false` is honoured over the default, which is pinned in
-    // presenter-chat-default.test.ts so the product cannot change somebody's answer behind their back.
     autoOpenChat: true,
     reduceMotion: false,
 };
@@ -101,10 +84,6 @@ export function loadPresenterSettings() {
                 ? o['outputDetail']
                 : DEFAULT_SETTINGS.outputDetail,
             reactComponents: true === o['reactComponents'],
-            // NOT read back from storage. "Until restart" has to mean until restart: persisted, it
-            // survived the reload that was supposed to undo it, and the only way back was clearing
-            // localStorage by hand - the HUD was simply gone, including the settings panel that turned
-            // it off. It is a this-page-only switch, so it lives only in memory.
             hideUntilRestart: false,
             statusThemeId: isStatusThemeId(o['statusThemeId'])
                 ? o['statusThemeId']
@@ -140,7 +119,6 @@ function persistSettings(next) {
         localStorage.setItem(SETTINGS_STORAGE_KEY, JSON.stringify(next));
     }
     catch {
-        /* quota / private mode - settings still apply for this page */
     }
 }
 function patchSettings(patch) {
@@ -168,7 +146,6 @@ function settingsCheckRow(key, label, checked) {
     <span class="reticle-settings-check-label">${label}</span>
   </label>`;
 }
-/** Settings panel markup - anchored above the gear in the toolbar. */
 export function settingsPanelHtml() {
     const close = hiIconHtml(PresenterIcon.REMOVE, PRESENTER_ICON_SIZE.MIN);
     const caret = hiIconHtml(PresenterIcon.CARET_RIGHT, PRESENTER_ICON_SIZE.HELP);
@@ -180,7 +157,7 @@ export function settingsPanelHtml() {
     const autoChatHelp = 'On by default. Opens the agent chat by itself when a session starts and when you expand the HUD. Off leaves the toolbar bare until you ask for the chat.';
     const motionHelp = 'Reduce HUD animations for accessibility';
     const glowHelp = 'Glow the page edges in the status colour while a session is live. Off keeps the HUD signals and leaves your app alone.';
-    return `<div ${SETTINGS_PANEL_ATTR} class="reticle-settings ${HUD_SURFACE_CLASS}" role="dialog" aria-label="Reticle settings" aria-hidden="true">
+    return `<div ${SETTINGS_PANEL_ATTR} class="reticle-settings ${HUD_SURFACE_CLASS}" role="region" aria-label="Reticle settings" aria-hidden="true">
     <div class="reticle-settings-inner">
       <div class="reticle-settings-head">
         <span class="reticle-settings-title">Settings</span>
@@ -213,7 +190,6 @@ export function settingsPanelHtml() {
     </div>
   </div>`;
 }
-/** Apply persisted settings onto the overlay + dock. */
 export function applyPresenterSettings(root, settings) {
     const theme = statusTheme(settings.statusThemeId);
     root.style.setProperty('--reticle-mark-accent', theme.active);
@@ -235,14 +211,9 @@ export function applyPresenterSettings(root, settings) {
         tally.setAttribute('hidden', '');
     }
 }
-/**
- * Toggle the full-page blocker. Only active while annotate mode is live AND the user opted in -
- * never on a collapsed FAB, so real hover/click on the host app still works.
- */
 export function syncPageBlocker(root, settings, annotateLive) {
     root.setAttribute(BLOCK_ATTR, settings.blockPageInteractions && annotateLive ? '1' : '0');
 }
-/** Blocker node - sits under Reticle UI, above the host page. */
 export function blockerHtml() {
     return '<div data-reticle-blocker aria-hidden="true"></div>';
 }
@@ -470,7 +441,6 @@ export class PresenterSettingsPanel {
             el.textContent = on ? '✓' : '';
         }
     }
-    /** One row of themes: each chip shows the whole set - active, idle, ended - in order. */
     #buildThemes() {
         const host = this.#panel?.querySelector('[data-reticle-settings-themes]');
         if (null === host || undefined === host)

package/dist/presenter/presenter-shell-styles.js

@@ -1,8 +1,5 @@
-/**
- * Floating HUD shell styles - FAB, morphing toolbar, and agent chat panel.
- * Split from presenter-styles.ts so the controller stays under the size cap.
- */
 import { LOG_TIME_ATTR } from './presenter-log.js';
+import { Z_HUD_TOOLTIP } from './presenter-config.js';
 import { CHAT_ATTR, CHAT_PILL_ATTR, CHAT_PLACEMENT_ATTR, DOCK_ALIGN_ATTR, DOCK_ATTR, LOG_TIMESTAMPS_ATTR, MIN_ATTR, REDUCE_MOTION_ATTR, LIVENESS_ATTR, } from './presenter-config.js';
 import { HUD_DROP_SHADOW, HUD_SURFACE_FILL } from './presenter-hud-chrome.js';
 const OVERLAY = 'data-reticle-overlay';
@@ -289,7 +286,7 @@ export const SHELL_CSS = `
 [${HUD}] .reticle-tb-tip{
   position:absolute;bottom:calc(100% + 14px);left:50%;transform:translateX(-50%) scale(.95);
   padding:6px 10px;background:#1a1a1a;color:rgba(255,255,255,.9);font-size:12px;font-weight:500;
-  border-radius:8px;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;z-index:3;
+  border-radius:8px;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;z-index:${String(Z_HUD_TOOLTIP)};
   box-shadow:0 2px 8px rgba(0,0,0,.3);transition:opacity .135s ease,transform .135s ease,visibility .135s;}
 [${HUD}] .reticle-tb-tip::after{
   content:"";position:absolute;top:calc(100% - 4px);left:50%;transform:translateX(-50%) rotate(45deg);