@kgdiff/viewer 0.3.0 → 0.4.0

package/README.md

@@ -1,7 +1,7 @@
 # @kgdiff/viewer
 
-`<kgdiff-viewer>`, a framework-agnostic web component for reviewing graph diffs. Four views
-(Overlay, Swipe, Replay and Changes only), a searchable change list, a detail panel with
+`<kgdiff-viewer>`, a framework-agnostic web component for reviewing graph diffs. Three ways to
+compare (Overlay, Swipe, Replay), each with or without Changes only, a searchable change list, a detail panel with
 character-level diffs, review progress, deep links, keyboard shortcuts, light and dark themes, and
 an English and Chinese UI.
 
@@ -37,9 +37,10 @@ ESM only. Runs in evergreen browsers.
   self-contained script that defines the element and shows embedded payloads. The optional
   `@kgdiff/viewer/standalone/compute` add-on brings the diff engine and force layout for `load()`.
 
-Attributes: `mode` (`overlay` | `swipe` | `replay` | `changes`), `theme`, `palette`, `locale`,
-`sidebar`, `sync-hash`, `global-shortcuts`, `header`, `chrome`, `legend`, `loop`, `loop-delay`,
-`pause-on-hover`. Methods: `load`, `selectHunk`, `next`, `prev`, `play`, `pause`, `fit`,
+Attributes: `mode` (`overlay` | `swipe` | `replay`), `scope` (`all` | `changes`), `theme`,
+`palette`, `locale`, `sidebar`, `sync-hash`, `global-shortcuts`, `header`, `chrome`, `legend`,
+`loop`, `loop-delay`, `pause-on-hover`. The legacy `mode="changes"` still works: it means
+`overlay` with `scope="changes"`. Methods: `load`, `selectHunk`, `next`, `prev`, `play`, `pause`, `fit`,
 `exportDelta`, `reviewState`, `setReviewed`. Events: `kgdiff-ready`, `kgdiff-select`,
 `kgdiff-mode`, `kgdiff-review`, `kgdiff-error`, `kgdiff-replay-end`.
 
@@ -60,9 +61,9 @@ replay loop:
 | `loop-delay` (`loopDelay`)        | ms between the end and restart | `1200`                                           |
 | `pause-on-hover` (`pauseOnHover`) | `false` to keep playing        | on: a looping replay pauses under a mouse or pen |
 
-- `chrome="none"` shows the graph alone: no header (view switch, theme, full screen, help,
-  sidebar button), change list, step caption, playback bar, finished card, zoom buttons, minimap
-  or legend card. The hover tooltip stays, and the legend becomes one line with the families this
+- `chrome="none"` shows the graph alone: no title, actions (theme, help, sidebar button), view
+  dock (with its step caption, playback bar and finished card), change list, zoom buttons,
+  minimap or legend card. The hover tooltip stays, and the legend becomes one line with the families this
   diff has, then unchanged. Clicks and keyboard shortcuts do nothing. The minimum height drops
   from 420px to 120px. The view stays fitted: when the canvas is resized (unless the user
   panned or zoomed since) and at the start of every loop. Labels are never cut at the edge: one

package/dist/controller.d.ts

@@ -2,8 +2,9 @@
  * Viewer state and orchestration, independent of the UI:
  *
  * - load pipeline with progress steps (sources or a precomputed report);
- * - mode, selection (with an animated spotlight `emphasis`), family filters, review progress;
- * - changes-only focus with expandable collapsed groups (`extendLayout` + scene rebuild);
+ * - view (mode × scope), selection (with an animated spotlight `emphasis`), family filters,
+ *   review progress;
+ * - the `changes` scope's focus with expandable collapsed groups (`extendLayout` + scene rebuild);
  * - replay clock driven by one requestAnimationFrame loop that sleeps when idle, with a camera
  *   that follows the playing hunk / chapter unless the user moved it in the last 2 s;
  * - swipe position, hover, theme / palette / locale (rebuilding the scene when they change).
@@ -15,18 +16,19 @@ import type { LayoutResult } from '@kgdiff/layout';
 import { type Camera } from '@kgdiff/renderer';
 import { type ChangeFamily, type FocusState, type PaletteName, type Scene, type Theme, type ThemeName, type VisualResolver } from '@kgdiff/scene';
 import { type ChromeLayout } from './framing.js';
-import type { LoadOptions, ReportPayload, ReviewState, ThemePreference, ViewerMode } from './index.js';
+import type { LoadOptions, ReportPayload, ReviewState, ThemePreference, ViewerMode, ViewerScope } from './index.js';
 import { type ListModel } from './list-model.js';
 import { type LoadedDiff, type LoadStep } from './pipeline.js';
+import { LEGACY_CHANGES_MODE } from './prefs.js';
 import { ReplayClock } from './replay.js';
 import { type StorageLike } from './review-store.js';
 import { type SearchHit } from './search.js';
 export type Status = 'idle' | 'loading' | 'ready' | 'error';
-export type Topic = 'status' | 'data' | 'mode' | 'selection' | 'filters' | 'review' | 'replay' | 'hover' | 'theme' | 'locale' | 'focus' | 'swipe';
+export type Topic = 'status' | 'data' | 'mode' | 'selection' | 'filters' | 'review' | 'replay' | 'hover' | 'theme' | 'locale' | 'focus' | 'swipe' | 'overview';
 export interface ControllerHost {
     ready(stats: DiffStats): void;
     select(hunk: string | null, node: string | null): void;
-    mode(mode: ViewerMode): void;
+    mode(mode: ViewerMode, scope: ViewerScope): void;
     review(hunk: string, reviewed: boolean, progress: ReviewState): void;
     error(error: Error): void;
     announce(text: string): void;
@@ -46,7 +48,7 @@ export interface ControllerDeps {
     readonly yieldToPaint: () => Promise<void>;
     readonly storage: StorageLike | null;
 }
-export type Preference = 'mode' | 'theme' | 'palette' | 'locale';
+export type Preference = 'mode' | 'scope' | 'theme' | 'palette' | 'locale';
 /** Camera follow is suppressed this long after the user moved the camera (ms). */
 export declare const USER_CAMERA_GRACE = 2000;
 /** The camera follows when less than this share of the target bounds is in view. */
@@ -55,6 +57,8 @@ export declare const FOLLOW_COVERAGE = 0.7;
 export declare const FLY_MAX_ZOOM = 1.8;
 /** Fitting everything never zooms in further (the renderer's default). */
 export declare const FIT_MAX_ZOOM = 2.5;
+/** Everything counts as in view (the minimap hides) from this share of the content bounds on. */
+export declare const OVERVIEW_COVERAGE = 0.98;
 /** Share of `bounds` inside `view`, in [0, 1]. */
 export declare function coverage(bounds: Rect, view: Rect): number;
 export declare class ViewerController {
@@ -70,6 +74,7 @@ export declare class ViewerController {
     resolver: VisualResolver | null;
     list: ListModel;
     mode: ViewerMode;
+    scope: ViewerScope;
     themePreference: ThemePreference;
     palette: PaletteName;
     locale: Locale;
@@ -98,6 +103,8 @@ export declare class ViewerController {
     autoFit: boolean;
     /** Canvas clicks select (and double clicks fly); off for embeds without controls. */
     selectOnClick: boolean;
+    /** The whole content is in view (the minimap has nothing to add). */
+    overview: boolean;
     constructor(host: ControllerHost, deps: ControllerDeps);
     subscribe(listener: (topics: ReadonlySet<Topic>) => void): () => void;
     /** Deliver pending notifications now (also used by tests). */
@@ -138,7 +145,16 @@ export declare class ViewerController {
     invalidate(): void;
     /** Resolve the current view and hand it to the renderer (and the minimap). */
     draw(now?: number): void;
-    setMode(value: ViewerMode): void;
+    /** Whether the scope is fixed to `changes` (the layout covers only the changes). */
+    get scopeLocked(): boolean;
+    /** Switch how the versions are compared. The legacy `changes` means overlay + `changes` scope. */
+    setMode(value: ViewerMode | typeof LEGACY_CHANGES_MODE): void;
+    /** Show the whole graph or only the changes, in any mode. */
+    setScope(value: ViewerScope): void;
+    /** Toggle the `changes` scope (key `4`); says why when the scope is locked. */
+    toggleScope(): void;
+    /** Set mode and scope together (one notification, one `kgdiff-mode` event). */
+    setView(mode: ViewerMode, scope: ViewerScope): void;
     selectHunkById(id: string | null, options?: {
         fly?: boolean;
     }): void;

package/dist/controller.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"controller.d.ts","sourceRoot":"","sources":["../src/controller.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"controller.d.ts","sourceRoot":"","sources":["../src/controller.ts"],"names":[],"mappings":"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"}

package/dist/controller.js

@@ -6,7 +6,7 @@ import { chromeInsets, FRAME_PADDING, freeView, NO_INSETS, zoomFit, } from './fr
 import { translate } from './i18n.js';
 import { buildList, EMPTY_LIST, stepHunk } from './list-model.js';
 import { readPayload, runLoad } from './pipeline.js';
-import { toLocale, toMode, toPalette, toTheme } from './prefs.js';
+import { LEGACY_CHANGES_MODE, toLocale, toMode, toPalette, toScope, toTheme } from './prefs.js';
 import { renderBackend } from './renderer-port.js';
 import { ReplayClock } from './replay.js';
 import { ReviewStore, reviewKey } from './review-store.js';
@@ -23,6 +23,8 @@ export const FLY_MAX_ZOOM = 1.8;
 export const FIT_MAX_ZOOM = 2.5;
 /** Minimap marks are re-rasterized at most this often while replaying (ms). */
 const MINIMAP_INTERVAL = 200;
+/** Everything counts as in view (the minimap hides) from this share of the content bounds on. */
+export const OVERVIEW_COVERAGE = 0.98;
 class Superseded extends Error {
 }
 /** Share of `bounds` inside `view`, in [0, 1]. */
@@ -52,6 +54,7 @@ export class ViewerController {
     resolver = null;
     list = EMPTY_LIST;
     mode = 'overlay';
+    scope = 'all';
     themePreference = 'auto';
     palette = 'default';
     locale = 'en';
@@ -81,6 +84,8 @@ export class ViewerController {
     /** Canvas clicks select (and double clicks fly); off for embeds without controls. */
     selectOnClick = true;
     #labelsInside = false;
+    /** The whole content is in view (the minimap has nothing to add). */
+    overview = true;
     #review = null;
     #searchIndex = null;
     #renderer = null;
@@ -98,6 +103,7 @@ export class ViewerController {
     #followed = '';
     #loadToken = 0;
     #pendingHunk = null;
+    #boundsCache = null;
     #chrome = null;
     /** Camera kept across detach / attach (element moved in the DOM). */
     #savedCamera = null;
@@ -270,10 +276,16 @@ export class ViewerController {
                 this.locale = view.locale;
         }
         const previousMode = this.mode;
-        if (!this.explicit.has('mode')) {
+        const previousScope = this.scope;
+        if (!this.explicit.has('mode'))
+            this.mode = view?.mode ?? 'overlay';
+        if (layout.scope === 'changes') {
+            // Only the changes are laid out: there is no whole graph to show.
+            this.scope = 'changes';
+        }
+        else if (!this.explicit.has('scope')) {
             const threshold = loaded.layoutOptions?.largeGraphThreshold ?? 3000;
-            const large = layout.scope === 'changes' || diff.nodes.length > threshold;
-            this.mode = view?.mode ?? (large ? 'changes' : 'overlay');
+            this.scope = view?.scope ?? (diff.nodes.length > threshold ? 'changes' : 'all');
         }
         this.#review = new ReviewStore(this.#deps.storage, reviewKey(diff.delta.base.hash, diff.delta.target.hash), diff.hunks.map((h) => h.id));
         this.#rebuildScene();
@@ -283,15 +295,16 @@ export class ViewerController {
             // Learn early whether out-of-layout groups can be expanded (standalone reports).
             loadCompute().then(() => this.#notify('focus'), () => this.#notify('focus'));
         }
-        this.#notify('status', 'data', 'mode', 'selection', 'filters', 'review', 'replay', 'theme', 'locale', 'focus', 'swipe');
+        this.#notify('status', 'data', 'mode', 'selection', 'filters', 'review', 'replay', 'theme', 'locale', 'focus', 'swipe', 'overview');
         // A new diff starts fitted, after the UI has shown its chrome (the notification above is
         // delivered first) and once the canvas has a size (see `layoutChanged`).
         this.#needsFit = true;
         this.#savedCamera = null;
         queueMicrotask(() => this.layoutChanged());
         this.#host.ready(diff.stats);
-        if (this.mode !== previousMode)
-            this.#host.mode(this.mode);
+        if (this.mode !== previousMode || this.scope !== previousScope) {
+            this.#host.mode(this.mode, this.scope);
+        }
         const pending = this.#pendingHunk;
         this.#pendingHunk = null;
         if (pending !== null)
@@ -334,7 +347,7 @@ export class ViewerController {
     }
     #updateFocus() {
         const scene = this.scene;
-        if (!scene || this.mode !== 'changes') {
+        if (!scene || this.scope !== 'changes') {
             this.focus = null;
             return;
         }
@@ -364,6 +377,7 @@ export class ViewerController {
         this.#unbind.push(renderer.on('hover', (pick) => this.#onHover(pick)), renderer.on('click', ({ pick }) => this.#onCanvasClick(pick)), renderer.on('dblclick', ({ pick }) => this.#onCanvasDblClick(pick)), renderer.on('camera', ({ source }) => {
             if (source === 'user')
                 this.noteUserCamera();
+            this.#updateOverview();
         }));
         this.#minimapDirty = true;
         this.invalidate();
@@ -410,6 +424,7 @@ export class ViewerController {
      * `autoFit`) fit again unless the user moved the camera since the last fit.
      */
     layoutChanged() {
+        this.#updateOverview();
         if (this.status !== 'ready')
             return;
         if (!this.#needsFit) {
@@ -570,27 +585,70 @@ export class ViewerController {
             duration: this.theme.motion.base,
         };
     }
-    // ─── Mode ─────────────────────────────────────────────────────────────────
+    // ─── View: mode × scope ───────────────────────────────────────────────────
+    /** Whether the scope is fixed to `changes` (the layout covers only the changes). */
+    get scopeLocked() {
+        return this.layout?.scope === 'changes';
+    }
+    /** Switch how the versions are compared. The legacy `changes` means overlay + `changes` scope. */
     setMode(value) {
+        if (value === LEGACY_CHANGES_MODE) {
+            this.setView('overlay', 'changes');
+            return;
+        }
         const mode = toMode(value);
-        if (mode === null || mode === this.mode)
+        if (mode !== null)
+            this.setView(mode, this.scope);
+    }
+    /** Show the whole graph or only the changes, in any mode. */
+    setScope(value) {
+        const scope = toScope(value);
+        if (scope !== null)
+            this.setView(this.mode, scope);
+    }
+    /** Toggle the `changes` scope (key `4`); says why when the scope is locked. */
+    toggleScope() {
+        if (this.scopeLocked) {
+            this.#host.announce(translate(this.locale, 'scope.locked'));
+            return;
+        }
+        this.setScope(this.scope === 'changes' ? 'all' : 'changes');
+    }
+    /** Set mode and scope together (one notification, one `kgdiff-mode` event). */
+    setView(mode, scope) {
+        const nextScope = this.scopeLocked ? 'changes' : scope;
+        const modeChanged = mode !== this.mode;
+        const scopeChanged = nextScope !== this.scope;
+        if (!modeChanged && !scopeChanged)
             return;
         this.mode = mode;
+        this.scope = nextScope;
         if (mode !== 'replay') {
             this.clock?.pause();
             this.#restartAt = Number.NaN;
             this.#resume = false;
         }
         this.#followed = '';
-        this.#updateFocus();
+        if (scopeChanged) {
+            this.#updateFocus();
+            this.#updateOverview();
+        }
         this.#minimapDirty = true;
         this.#notify('mode', 'focus', 'replay');
         this.invalidate();
         if (this.status === 'ready') {
-            this.#host.mode(mode);
-            this.#host.announce(translate(this.locale, 'announce.mode', { mode: translate(this.locale, `mode.${mode}`) }));
+            this.#host.mode(mode, nextScope);
+            const parts = [];
+            if (modeChanged) {
+                parts.push(translate(this.locale, 'announce.mode', { mode: translate(this.locale, `mode.${mode}`) }));
+            }
+            if (scopeChanged) {
+                parts.push(translate(this.locale, nextScope === 'changes' ? 'scope.on' : 'scope.off'));
+            }
+            this.#host.announce(parts.join(' · '));
         }
-        if (mode === 'replay')
+        // Switching to replay starts a looping replay; toggling the scope leaves playback alone.
+        if (modeChanged && mode === 'replay')
             this.#autoplay();
     }
     // ─── Selection ────────────────────────────────────────────────────────────
@@ -905,6 +963,29 @@ export class ViewerController {
         }
         return { bounds: fit.bounds, insets };
     }
+    /** Bounds of what is drawn: the scene, or the visible part of the `changes` scope's focus. */
+    #contentBounds() {
+        const scene = this.scene;
+        if (!scene)
+            return null;
+        const focus = this.focus;
+        const cached = this.#boundsCache;
+        if (cached && cached.scene === scene && cached.focus === focus)
+            return cached.rect;
+        const rect = focus ? focusBounds(scene, focus) : frameBounds(scene);
+        this.#boundsCache = { scene, focus, rect };
+        return rect;
+    }
+    /** Whether everything drawn is in view; the minimap hides while it is. */
+    #updateOverview() {
+        const bounds = this.#contentBounds();
+        const view = this.#renderer?.camera.viewport();
+        const next = !bounds || !view || coverage(bounds, view) >= OVERVIEW_COVERAGE;
+        if (next === this.overview)
+            return;
+        this.overview = next;
+        this.#notify('overview');
+    }
     zoom(direction) {
         this.noteUserCamera();
         this.#renderer?.camera.zoomBy(direction > 0 ? 1.4 : 1 / 1.4);
@@ -1012,6 +1093,7 @@ export class ViewerController {
             return;
         this.hops = h;
         this.#updateFocus();
+        this.#updateOverview();
         this.#minimapDirty = true;
         this.#notify('focus');
         this.invalidate();
@@ -1141,6 +1223,7 @@ export class ViewerController {
     }
     #focusChanged() {
         this.#updateFocus();
+        this.#updateOverview();
         this.#minimapDirty = true;
         this.#notify('focus');
         this.invalidate();
@@ -1394,6 +1477,28 @@ function isString(x) {
 function sameInsets(a, b) {
     return a.top === b.top && a.right === b.right && a.bottom === b.bottom && a.left === b.left;
 }
+/** Bounds of the visible part of `focus`, with room for labels and the collapsed pills. */
+function focusBounds(scene, focus) {
+    let x0 = Number.POSITIVE_INFINITY;
+    let y0 = Number.POSITIVE_INFINITY;
+    let x1 = Number.NEGATIVE_INFINITY;
+    let y1 = Number.NEGATIVE_INFINITY;
+    const add = (x, y, rx, top, bottom) => {
+        x0 = Math.min(x0, x - rx);
+        x1 = Math.max(x1, x + rx);
+        y0 = Math.min(y0, y - top);
+        y1 = Math.max(y1, y + bottom);
+    };
+    // Labels sit centered below their node: leave room for a typical one.
+    for (const n of scene.nodes)
+        if (focus.nodes[n.index] === 1)
+            add(n.x, n.y, n.r + 48, n.r, n.r + 24);
+    for (const g of focus.collapsed)
+        add(g.x, g.y, 48, 12, 12);
+    if (!(x0 <= x1))
+        return frameBounds(scene);
+    return padRect({ x: x0, y: y0, width: x1 - x0, height: y1 - y0 }, 160, 1.12);
+}
 /** Pad a small rect so a node is shown with its neighbourhood. */
 function padRect(r, min = 200, ratio = 1.4) {
     const w = Math.max(min, r.width * ratio);