@westbayberry/dg 2.1.0 → 2.2.0

package/dist/scan-ui/components/InteractiveResultsView.js

@@ -2,17 +2,34 @@ import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-run
 import { useReducer, useMemo, useRef, useEffect, useState } from "react";
 import { Box, Text, useInput } from "ink";
 import chalk from "chalk";
-import { writeFileSync } from "node:fs";
-import { resolve as resolvePath } from "node:path";
-import { isLoggedIn } from "../shims.js";
+import { ExportDialog, loginRequiredToast } from "../../export-ui/ExportDialog.js";
+import { resolvePresentation } from "../../presentation/mode.js";
+import { createTheme } from "../../presentation/theme.js";
+import { packagePageUrl } from "../../presentation/package-page.js";
+import { accountHeaderLine, isLoggedIn } from "../shims.js";
 import { packageKey } from "../../decisions/apply.js";
-import { ScoreHeader, COMPACT_ROWS } from "./ScoreHeader.js";
+import { ScoreHeader, COMPACT_ROWS, LOGO_MIN_COLS } from "./ScoreHeader.js";
+import { renderLogo } from "../logo.js";
 import { useExpandAnimation } from "../hooks/useExpandAnimation.js";
 import { useTerminalSize } from "../hooks/useTerminalSize.js";
 import { clearScreen } from "../alt-screen.js";
 import { pad, truncate, groupPackages as sharedGroupPackages, formatUsage } from "../format-helpers.js";
 import { provenanceLabel, provenanceDowngradeLine } from "../../presentation/provenance.js";
 const ACK_PREVIEW_LIMIT = 3;
+const EXPORT_SCOPE_LABELS = {
+    all: "All",
+    summary: "Summary",
+    packages: "Packages",
+    licenses: "Licenses",
+    findings: "Findings (warn+block)",
+    "current-license": "Current license"
+};
+const EXPORT_FORMAT_LABELS = {
+    json: "JSON",
+    csv: "CSV",
+    md: "Markdown",
+    txt: "Plain text"
+};
 function groupPackages(packages) {
     return sharedGroupPackages(packages, "fingerprint");
 }
@@ -68,11 +85,24 @@ function packageDowngradeLine(pkg) {
 }
 const EVIDENCE_LIMIT = 2;
 const BADGE_COL = "Unverified".length + 1;
-// Fixed lines outside the scrollable group area:
-//  5  ScoreHeader box  |  2  Flagged box top  |  2  scroll indicators
-//  1  Flagged box bottom  |  4  Clean/Duration box  |  1  help bar  |  1  margin
-const FIXED_CHROME = 21;
-const FIXED_CHROME_COMPACT = 14;
+// Mirrors the list-mode render row-for-row; drift shows up as blank rows or
+// overflow on short terminals (counts pinned by resolveResultsLayout tests).
+// Header text column: title + score + counts (+usage), full mode adds 2 spacer
+// lines and the box is as tall as the logo when shown. Full chrome adds the
+// flagged divider + heading and divider + summary + divider + help bar;
+// compact drops the logo, spacers, and all three dividers.
+export function resolveResultsLayout(input) {
+    const textRows = input.hasUsage ? 4 : 3;
+    const fullHeader = 2 + Math.max(input.logoRows, textRows + 2);
+    const compactHeader = 2 + textRows;
+    const shared = input.ackSectionLines + input.extraLines;
+    const fullChrome = fullHeader + (input.hasGroups ? 2 : 0) + 4 + shared;
+    const compactChrome = compactHeader + (input.hasGroups ? 1 : 0) + 2 + shared;
+    const compact = input.termRows < COMPACT_ROWS && input.listRows > input.termRows - fullChrome;
+    const maxList = input.termRows - (compact ? compactChrome : fullChrome);
+    const availableRows = Math.max(5, input.listRows <= maxList ? maxList : maxList - 2);
+    return { compact, availableRows };
+}
 function firstPackage(group) {
     const rep = group.packages[0];
     if (!rep)
@@ -149,6 +179,10 @@ function buildDetailLines(group, safeVersion, maxWidth) {
     const isFree = visibleFindings.length > 0 && !visibleFindings[0]?.title;
     const lines = [];
     lines.push(_jsxs(Text, { wrap: "truncate-end", children: [chalk.dim("Verdict"), " ", badge.color(badge.label), rep.version ? chalk.dim(`  ·  v${rep.version}`) : "", analyzedAt ? chalk.dim(`  ·  analyzed ${analyzedAt}`) : ""] }, "verdict"));
+    const page = packagePageUrl(rep.ecosystem ?? "", rep.name);
+    if (page) {
+        lines.push(_jsx(Text, { dimColor: true, wrap: "truncate-end", children: `Full report  ${page}` }, "page"));
+    }
     lines.push(_jsx(Text, { children: "" }, "verdict-gap"));
     if (group.packages.length > 3) {
         lines.push(_jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["Affects: ", affectsLine(group)] }, "affects"));
@@ -220,17 +254,15 @@ function viewReducer(_state, action) {
             return { ..._state, expandedKey: action.expandedKey, expandLevel: action.expandLevel, viewport: action.viewport };
     }
 }
-export const InteractiveResultsView = ({ result, config: _config, durationMs, onExit, onBack, discoveredTotal, userStatus, scanUsage: scanUsageProp, initialView, decisions, }) => {
-    // Prefer the server's uniform usage block ("used / limit packages this
-    // month"); fall back to the legacy freeScansRemaining field, then to the
-    // generic placeholder from bin.ts. usageNearLimit drives the yellow + nudge.
+export const InteractiveResultsView = ({ result, config: _config, durationMs, onExit, onBack, discoveredTotal, initialView, decisions, }) => {
     const usageDisplay = result.usage ? formatUsage(result.usage) : null;
     const scanUsage = usageDisplay
         ? usageDisplay.text
         : result.freeScansRemaining !== undefined
             ? `${result.freeScansRemaining.toLocaleString()} packages left`
-            : scanUsageProp;
+            : undefined;
     const usageNearLimit = usageDisplay?.nearLimit ?? false;
+    const headerStatus = useMemo(() => accountHeaderLine(result.usage?.tier), [result.usage]);
     // Bucket by the server `action`, never by score: the server can return
     // block/warn at score 0 (policy verdict / yanked / cooldown), and those must
     // surface as flagged, not hide in "clean".
@@ -289,10 +321,6 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
     const [showHelp, setShowHelp] = useState(false);
     const showHelpRef = useRef(showHelp);
     showHelpRef.current = showHelp;
-    // License-grouped overlay. Toggled with `l`. Shows packages grouped by
-    // SPDX license id, sorted by count desc, color-coded by risk category.
-    // Up/Down to select a row, Enter to drill into the packages for that
-    // license, Esc to back out, l/Esc again to close the overlay.
     const [showLicenses, setShowLicenses] = useState(initialView === "licenses");
     const showLicensesRef = useRef(showLicenses);
     showLicensesRef.current = showLicenses;
@@ -303,20 +331,23 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
     const licenseDetailIdxRef = useRef(licenseDetailIdx);
     licenseDetailIdxRef.current = licenseDetailIdx;
     const [licenseDetailScroll, setLicenseDetailScroll] = useState(0);
-    // Search inside the license drill-in: type-to-filter packages by name.
     const [licenseSearchMode, setLicenseSearchMode] = useState(false);
     const licenseSearchModeRef = useRef(licenseSearchMode);
     licenseSearchModeRef.current = licenseSearchMode;
     const [licenseSearchQuery, setLicenseSearchQuery] = useState("");
-    // Export status (shown briefly in the footer after `e`).
     const [exportMsg, setExportMsg] = useState(null);
     const exportMsgRef = useRef(null);
-    const showExportMsg = (s) => {
-        setExportMsg(s);
+    const showExportMsg = (text, tone = "ok") => {
+        setExportMsg({ text, tone });
         if (exportMsgRef.current)
             clearTimeout(exportMsgRef.current);
         exportMsgRef.current = setTimeout(() => setExportMsg(null), 4000);
     };
+    const exportMsgText = exportMsg
+        ? exportMsg.tone === "nudge"
+            ? exportMsg.text
+            : (exportMsg.tone === "error" ? chalk.red : chalk.green)(exportMsg.text)
+        : null;
     useEffect(() => () => {
         if (exportMsgRef.current)
             clearTimeout(exportMsgRef.current);
@@ -324,17 +355,18 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
     const [exportMenu, setExportMenu] = useState(null);
     const exportMenuRef = useRef(exportMenu);
     exportMenuRef.current = exportMenu;
+    const [exportDialog, setExportDialog] = useState(null);
+    const exportDialogRef = useRef(exportDialog);
+    exportDialogRef.current = exportDialog;
+    const theme = useMemo(() => createTheme(resolvePresentation().color), []);
     const openExportMenu = (defaultScope = "all") => {
         if (!isLoggedIn()) {
-            // Saved reports are a logged-in feature. Show the calm nudge instead
-            // of letting the user navigate a menu they can't actually use.
-            showExportMsg("Export requires `dg login` (free account)");
+            // Saved reports are a logged-in feature.
+            showExportMsg(loginRequiredToast(), "nudge");
             return;
         }
         setExportMenu({ scope: defaultScope, format: "json", activeRow: "scope" });
     };
-    /** Build the JS object for a given export scope. The `currentLicenseIdx`
-     *  parameter scopes "current-license" to the drill-in user is viewing. */
     const buildExportPayload = (scope, currentLicenseIdx) => {
         const blocked = result.packages.filter((p) => p.action === "block");
         const warned = result.packages.filter((p) => p.action === "warn");
@@ -395,7 +427,6 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
                 reasons: p.reasons,
             }));
         }
-        // scope === "all"
         return {
             ...summary,
             packages: result.packages,
@@ -408,20 +439,15 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             })),
         };
     };
-    /** Quote a CSV cell — escape double-quotes by doubling, wrap in quotes if
-     *  the value contains a comma, quote, or newline. */
     const csvCell = (v) => {
         const s = v === null || v === undefined ? "" : String(v);
         return /[",\n\r]/.test(s) ? `"${s.replace(/"/g, '""')}"` : s;
     };
-    /** Convert a payload + scope to a serialized string in the chosen format
-     *  plus the file extension. */
     const formatExport = (payload, scope, format) => {
         if (format === "json") {
             return { body: JSON.stringify(payload, null, 2) + "\n", ext: "json" };
         }
         if (format === "csv") {
-            // Tabular scopes only — flatten to header + rows.
             if (scope === "packages") {
                 const rows = payload;
                 const lines = ["name,version,score,license,riskCategory"];
@@ -473,10 +499,6 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             }
             return { body: lines.join("\n") + "\n", ext: "csv" };
         }
-        // Markdown — for `all`, render summary + packages table + licenses table
-        // in one document so the file matches what the user sees in the TUI.
-        // For `findings` with an empty list, surface that explicitly so the
-        // file isn't just a title and nothing else.
         if (format === "md") {
             const lines = [`# Dependency Guardian — ${scope}`, ""];
             lines.push(`*Scanned at ${new Date().toISOString()}*`, "");
@@ -540,7 +562,6 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             }
             return { body: lines.join("\n"), ext: "md" };
         }
-        // format === "txt" — quick human-readable, mirrors the md structure
         const txt = [`Dependency Guardian — ${scope}`, "=".repeat(40), ""];
         const txtSummary = (s) => {
             txt.push(`Score:    ${s.score} (${s.action})`);
@@ -603,33 +624,30 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
         }
         return { body: txt.join("\n") + "\n", ext: "txt" };
     };
-    /** Run the export with the given scope/format. Writes
-     *  ./dg-scan-<ts>-<scope>.<ext> and shows a footer toast. Requires login —
-     *  saved reports are a logged-in feature. */
-    const runExport = (scope, format, currentLicenseIdx) => {
-        if (!isLoggedIn()) {
-            showExportMsg("Export requires `dg login` (free account)");
+    const buildExportOption = (scope, format, currentLicenseIdx) => {
+        const payload = buildExportPayload(scope, currentLicenseIdx);
+        if (payload === null)
+            return null;
+        const { body, ext } = formatExport(payload, scope, format);
+        const scopeTag = scope === "current-license" && currentLicenseIdx !== null
+            ? `${(licenseGroups[currentLicenseIdx]?.spdx ?? "license").replace(/[^A-Za-z0-9._-]/g, "_").slice(0, 32)}`
+            : scope;
+        return {
+            label: `${EXPORT_SCOPE_LABELS[scope]} · ${EXPORT_FORMAT_LABELS[format]}`,
+            defaultName: scope === "all" ? `dg-scan.${ext}` : `dg-scan-${scopeTag}.${ext}`,
+            render: () => body
+        };
+    };
+    const handleExportDone = (result) => {
+        setExportDialog(null);
+        clearScreen();
+        if (result === null)
             return;
-        }
-        try {
-            const ts = new Date().toISOString().replace(/[:T]/g, "-").replace(/\..*$/, "");
-            const payload = buildExportPayload(scope, currentLicenseIdx);
-            if (payload === null) {
-                showExportMsg(`Nothing to export for scope "${scope}"`);
-                return;
-            }
-            const { body, ext } = formatExport(payload, scope, format);
-            const scopeTag = scope === "current-license" && currentLicenseIdx !== null
-                ? `${(licenseGroups[currentLicenseIdx]?.spdx ?? "license").replace(/[^A-Za-z0-9._-]/g, "_").slice(0, 32)}`
-                : scope;
-            const filename = `dg-scan-${ts}-${scopeTag}.${ext}`;
-            const path = resolvePath(process.cwd(), filename);
-            writeFileSync(path, body, "utf-8");
-            showExportMsg(`✓ Exported to ${filename}`);
-        }
-        catch (e) {
-            showExportMsg(`Export failed: ${e.message}`);
-        }
+        setExportMenu(null);
+        if ("path" in result)
+            showExportMsg(`✓ Exported to ${result.path}`);
+        else
+            showExportMsg(`Export failed: ${result.error}`, "error");
     };
     const licenseGroups = useMemo(() => {
         const buckets = new Map();
@@ -662,11 +680,10 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
     const searchModeRef = useRef(searchMode);
     searchModeRef.current = searchMode;
     const { rows: termRows, cols: termCols } = useTerminalSize();
-    const compact = termRows < COMPACT_ROWS;
+    const subviewCompact = termRows < COMPACT_ROWS;
     const ackSectionLines = acked.length > 0
         ? 2 + Math.min(ackGroups.length, ACK_PREVIEW_LIMIT) + (ackGroups.length > ACK_PREVIEW_LIMIT ? 1 : 0)
         : 0;
-    const availableRows = Math.max(5, termRows - (compact ? FIXED_CHROME_COMPACT : FIXED_CHROME) - ackSectionLines);
     const innerWidth = Math.max(40, termCols - 6);
     const detailGroup = useMemo(() => {
         if (!detailPane)
@@ -698,6 +715,17 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             return 1 + animVisibleLines;
         return groupRowHeight(group, level);
     };
+    const listRows = groups.reduce((sum, group, idx) => sum + animatedGroupHeight(group, getLevel(idx)), 0);
+    const { compact, availableRows } = resolveResultsLayout({
+        termRows,
+        logoRows: termCols >= LOGO_MIN_COLS ? renderLogo(result.action).length : 0,
+        listRows,
+        ackSectionLines,
+        hasGroups: groups.length > 0,
+        hasUsage: Boolean(scanUsage),
+        extraLines: (discoveredTotal !== undefined && discoveredTotal > total ? 1 : 0) +
+            (searchQuery && groups.length === 0 ? 1 : 0),
+    });
     const visibleEnd = useMemo(() => {
         let consumed = 0;
         let end = view.viewport;
@@ -744,7 +772,6 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
         }
         return newStart;
     };
-    // Re-clamp viewport when terminal is resized
     useEffect(() => {
         if (groups.length === 0)
             return;
@@ -753,7 +780,6 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
         const newVp = adjustViewport(cursor, expandedKey, expandLevel, clamped);
         dispatchView({ type: "MOVE", cursor, viewport: newVp });
     }, [availableRows]);
-    // Clamp detail pane scroll when terminal resizes
     useEffect(() => {
         const dp = detailPaneRef.current;
         if (dp && detailLines.length > 0) {
@@ -769,10 +795,8 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
         }
     }, [detailPane, detailGroup]);
     useInput((input, key) => {
-        // Export menu has the highest priority — once opened, all keys go here
-        // until ⏎/Esc dismisses it. Arrow-driven: ↑↓ scrolls within the active
-        // row, ←→ or Tab switches rows. No letter shortcuts (the user found
-        // them clunky and they collide with `q` / other meaningful keys).
+        if (exportDialogRef.current)
+            return;
         if (exportMenuRef.current) {
             const menu = exportMenuRef.current;
             const SCOPES = ["all", "summary", "packages", "licenses", "findings"];
@@ -793,9 +817,14 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             }
             if (key.return) {
                 const m = exportMenuRef.current;
-                setExportMenu(null);
+                const option = buildExportOption(m.scope, m.format, licenseDetailIdxRef.current);
                 clearScreen();
-                runExport(m.scope, m.format, licenseDetailIdxRef.current);
+                if (!option) {
+                    setExportMenu(null);
+                    showExportMsg(`Nothing to export for scope "${m.scope}"`);
+                    return;
+                }
+                setExportDialog(option);
                 return;
             }
             if (key.tab || key.leftArrow || key.rightArrow) {
@@ -834,9 +863,7 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             return;
         }
         if (showLicensesRef.current) {
-            // Drill-in mode: viewing the package list for one license.
             if (licenseDetailIdxRef.current !== null) {
-                // Search-typing mode inside drill-in: capture text input.
                 if (licenseSearchModeRef.current) {
                     if (key.escape) {
                         setLicenseSearchMode(false);
@@ -1060,32 +1087,23 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
     const visibleGroups = groups.slice(view.viewport, visibleEnd);
     const aboveCount = view.viewport;
     const belowCount = groups.length - visibleEnd;
-    const lcCol = 16; // fixed width for license column
+    const lcCol = 16;
     const nameCol = Math.max(20, innerWidth - BADGE_COL - 16 - lcCol);
     // Clamp cursor to valid range (groups may shrink via search filter)
     const clampedCursor = groups.length > 0 ? Math.min(view.cursor, groups.length - 1) : 0;
-    // ── Export menu overlay ──
+    if (exportDialog) {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: subviewCompact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsx(ExportDialog, { options: [exportDialog], theme: theme, cwd: process.cwd(), onDone: handleExportDone })] }));
+    }
     if (exportMenu) {
-        const SCOPES_RENDER = [
-            { value: "all", label: "All" },
-            { value: "summary", label: "Summary" },
-            { value: "packages", label: "Packages" },
-            { value: "licenses", label: "Licenses" },
-            { value: "findings", label: "Findings (warn+block)" },
-        ];
+        const SCOPES_RENDER = ["all", "summary", "packages", "licenses", "findings"].map((value) => ({ value, label: EXPORT_SCOPE_LABELS[value] }));
         if (licenseDetailIdxRef.current !== null) {
             const focus = licenseGroups[licenseDetailIdxRef.current];
             SCOPES_RENDER.push({
                 value: "current-license",
-                label: `Current license (${focus?.spdx ?? "—"})`,
+                label: `${EXPORT_SCOPE_LABELS["current-license"]} (${focus?.spdx ?? "—"})`,
             });
         }
-        const FORMATS_RENDER = [
-            { value: "json", label: "JSON" },
-            { value: "csv", label: "CSV" },
-            { value: "md", label: "Markdown" },
-            { value: "txt", label: "Plain text" },
-        ];
+        const FORMATS_RENDER = ["json", "csv", "md", "txt"].map((value) => ({ value, label: EXPORT_FORMAT_LABELS[value] }));
         const stackedLayout = termCols < 80;
         const colWidth = stackedLayout ? undefined : Math.max(24, Math.floor((termCols - 8) / 2));
         const renderColumn = (title, rows, current, isActive) => (_jsxs(Box, { flexDirection: "column", width: colWidth, flexShrink: 1, marginBottom: stackedLayout ? 1 : 0, children: [_jsxs(Text, { children: [isActive ? chalk.cyan("▌ ") : "  ", isActive ? chalk.bold(title) : chalk.dim(title)] }), rows.map((r) => {
@@ -1096,14 +1114,12 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
                     const text = selected ? chalk.bold(r.label) : r.label;
                     return (_jsxs(Box, { children: [_jsx(Box, { width: 5, flexShrink: 0, children: _jsxs(Text, { children: ["   ", bullet] }) }), _jsx(Box, { flexShrink: 1, children: _jsx(Text, { wrap: "truncate-end", children: text }) })] }, r.value));
                 })] }));
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, total: total, flagged: flagged.length, clean: clean.length, userStatus: userStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", paddingLeft: 2, paddingRight: 2, children: [_jsx(Text, { bold: true, children: "Export" }), _jsx(Text, { children: "" }), _jsxs(Box, { flexDirection: stackedLayout ? "column" : "row", children: [renderColumn("What", SCOPES_RENDER, exportMenu.scope, exportMenu.activeRow === "scope"), renderColumn("Format", FORMATS_RENDER, exportMenu.format, exportMenu.activeRow === "format")] })] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("↑↓"), " ", chalk.dim("scroll"), "   ", chalk.bold.cyan("←→/Tab"), " ", chalk.dim("switch row"), "   ", chalk.bold.cyan("⏎"), " ", chalk.dim("export"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("cancel")] })] }));
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: subviewCompact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", paddingLeft: 2, paddingRight: 2, children: [_jsx(Text, { bold: true, children: "Export" }), _jsx(Text, { children: "" }), _jsxs(Box, { flexDirection: stackedLayout ? "column" : "row", children: [renderColumn("What", SCOPES_RENDER, exportMenu.scope, exportMenu.activeRow === "scope"), renderColumn("Format", FORMATS_RENDER, exportMenu.format, exportMenu.activeRow === "format")] })] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("↑↓"), " ", chalk.dim("scroll"), "   ", chalk.bold.cyan("←→/Tab"), " ", chalk.dim("switch row"), "   ", chalk.bold.cyan("⏎"), " ", chalk.dim("export"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("cancel")] })] }));
     }
-    // ── Help overlay ──
     if (showHelp) {
         const isDetail = detailPane !== null;
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, total: total, flagged: flagged.length, clean: clean.length, userStatus: userStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsx(Text, { bold: true, children: "Keyboard Shortcuts" }), _jsx(Text, { children: "" }), _jsx(Text, { bold: true, children: " Navigation" }), _jsxs(Text, { children: ["   ", chalk.cyan("\u2191 k"), "     ", chalk.dim("Move up")] }), _jsxs(Text, { children: ["   ", chalk.cyan("\u2193 j"), "     ", chalk.dim("Move down")] }), _jsxs(Text, { children: ["   ", chalk.cyan("g"), "       ", chalk.dim("Jump to top")] }), _jsxs(Text, { children: ["   ", chalk.cyan("G"), "       ", chalk.dim("Jump to bottom")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("PgUp"), "    ", chalk.dim("Page up")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("PgDn"), "    ", chalk.dim("Page down")] }), _jsx(Text, { children: "" }), _jsx(Text, { bold: true, children: " Actions" }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("\u23CE"), "       ", chalk.dim("Expand findings (press again for full details)")] }), isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("Esc"), "     ", chalk.dim("Back to list")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("/"), "       ", chalk.dim("Search all scanned packages (incl. passed)")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("l"), "       ", chalk.dim("License breakdown (browse + drill-in)")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("e"), "       ", chalk.dim("Export menu — pick scope (all / summary / packages / licenses / findings) and format (JSON / CSV / Markdown / text)")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("Esc"), "     ", chalk.dim(onBack ? "Collapse row / clear search / back to project selector" : "Collapse row / clear search")] }), _jsxs(Text, { children: ["   ", chalk.cyan("q"), "       ", chalk.dim("Quit")] }), _jsx(Text, { children: "" }), _jsxs(Text, { dimColor: true, children: [" Press ", chalk.bold.cyan("?"), " or ", chalk.bold.cyan("Esc"), " to close"] })] })] }));
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: subviewCompact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsx(Text, { bold: true, children: "Keyboard Shortcuts" }), _jsx(Text, { children: "" }), _jsx(Text, { bold: true, children: " Navigation" }), _jsxs(Text, { children: ["   ", chalk.cyan("\u2191 k"), "     ", chalk.dim("Move up")] }), _jsxs(Text, { children: ["   ", chalk.cyan("\u2193 j"), "     ", chalk.dim("Move down")] }), _jsxs(Text, { children: ["   ", chalk.cyan("g"), "       ", chalk.dim("Jump to top")] }), _jsxs(Text, { children: ["   ", chalk.cyan("G"), "       ", chalk.dim("Jump to bottom")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("PgUp"), "    ", chalk.dim("Page up")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("PgDn"), "    ", chalk.dim("Page down")] }), _jsx(Text, { children: "" }), _jsx(Text, { bold: true, children: " Actions" }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("\u23CE"), "       ", chalk.dim("Expand findings (press again for full details)")] }), isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("Esc"), "     ", chalk.dim("Back to list")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("/"), "       ", chalk.dim("Search all scanned packages (incl. passed)")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("l"), "       ", chalk.dim("License breakdown (browse + drill-in)")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("e"), "       ", chalk.dim("Export menu — pick scope (all / summary / packages / licenses / findings) and format (JSON / CSV / Markdown / text)")] }), !isDetail && _jsxs(Text, { children: ["   ", chalk.cyan("Esc"), "     ", chalk.dim(onBack ? "Collapse row / clear search / back to project selector" : "Collapse row / clear search")] }), _jsxs(Text, { children: ["   ", chalk.cyan("q"), "       ", chalk.dim("Quit")] }), _jsx(Text, { children: "" }), _jsxs(Text, { dimColor: true, children: [" Press ", chalk.bold.cyan("?"), " or ", chalk.bold.cyan("Esc"), " to close"] })] })] }));
     }
-    // ── License overlay ──
     if (showLicenses) {
         const lcColor = (risk) => {
             if (risk === "permissive")
@@ -1132,35 +1148,34 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             const _above = top;
             const _below = filtered.length - bottom;
             const _slice = filtered.slice(top, bottom);
-            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, total: total, flagged: flagged.length, clean: clean.length, userStatus: userStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, children: color(g.spdx) }), _jsxs(Text, { dimColor: true, children: ["  \u00B7  ", g.risk, "  \u00B7  ", g.count, " package", g.count !== 1 ? "s" : "", q ? `  ·  ${filtered.length} match${filtered.length !== 1 ? "es" : ""}` : ""] })] }), licenseSearchMode || q ? (_jsx(Box, { children: _jsxs(Text, { children: [" ", chalk.bold.cyan("/"), " ", q || chalk.dim("(type to filter; Esc clears, Enter confirms)"), licenseSearchMode ? chalk.cyan("█") : ""] }) })) : (_jsx(Text, { children: "" })), _above > 0 && _jsx(Text, { dimColor: true, children: `  ↑ ${_above} more above` }), _slice.length === 0 && _jsx(Text, { dimColor: true, children: `  (no packages match "${q}")` }), _slice.map((p, i) => {
+            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: subviewCompact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "cyan", paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, children: color(g.spdx) }), _jsxs(Text, { dimColor: true, children: ["  \u00B7  ", g.risk, "  \u00B7  ", g.count, " package", g.count !== 1 ? "s" : "", q ? `  ·  ${filtered.length} match${filtered.length !== 1 ? "es" : ""}` : ""] })] }), licenseSearchMode || q ? (_jsx(Box, { children: _jsxs(Text, { children: [" ", chalk.bold.cyan("/"), " ", q || chalk.dim("(type to filter; Esc clears, Enter confirms)"), licenseSearchMode ? chalk.cyan("█") : ""] }) })) : (_jsx(Text, { children: "" })), _above > 0 && _jsx(Text, { dimColor: true, children: `  ↑ ${_above} more above` }), _slice.length === 0 && _jsx(Text, { dimColor: true, children: `  (no packages match "${q}")` }), _slice.map((p, i) => {
                                 const absIdx = top + i;
                                 const isSelected = absIdx === cursorIdx;
                                 const nameCol = Math.max(28, Math.floor(termCols * 0.55));
                                 if (isSelected) {
-                                    return (_jsxs(Text, { backgroundColor: "#1a1a2e", children: [chalk.cyan("▌"), " ", chalk.bold(pad(truncate(p.name, nameCol - 2), nameCol)), chalk.dim(pad(p.version, 16))] }, `${p.name}@${p.version}`));
+                                    return (_jsxs(Text, { backgroundColor: "#1a1a2e", wrap: "truncate-end", children: [chalk.cyan("▌"), " ", chalk.bold(pad(truncate(p.name, nameCol - 2), nameCol)), chalk.dim(pad(truncate(p.version, 15), 16))] }, `${p.name}@${p.version}`));
                                 }
-                                return (_jsxs(Text, { children: ["  ", pad(truncate(p.name, nameCol - 2), nameCol), chalk.dim(pad(p.version, 16))] }, `${p.name}@${p.version}`));
-                            }), _below > 0 && _jsx(Text, { dimColor: true, children: `  ↓ ${_below} more below` })] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("↑↓"), " ", chalk.dim("scroll"), "   ", chalk.bold.cyan("/"), " ", chalk.dim("search"), "   ", chalk.bold.cyan("e"), " ", chalk.dim("export"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("back"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit"), exportMsg && _jsxs(_Fragment, { children: ["   ", chalk.green(exportMsg)] })] })] }));
+                                return (_jsxs(Text, { wrap: "truncate-end", children: ["  ", pad(truncate(p.name, nameCol - 2), nameCol), chalk.dim(pad(truncate(p.version, 15), 16))] }, `${p.name}@${p.version}`));
+                            }), _below > 0 && _jsx(Text, { dimColor: true, children: `  ↓ ${_below} more below` })] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), (() => {
+                        const sel = filtered[cursorIdx];
+                        const page = sel ? packagePageUrl(sel.ecosystem ?? "", sel.name) : null;
+                        return page ? _jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.dim(`→ ${page}`)] }) : null;
+                    })(), _jsxs(Text, { children: [" ", chalk.bold.cyan("↑↓"), " ", chalk.dim("scroll"), "   ", chalk.bold.cyan("/"), " ", chalk.dim("search"), "   ", chalk.bold.cyan("e"), " ", chalk.dim("export"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("back"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit"), exportMsgText && _jsxs(_Fragment, { children: ["   ", exportMsgText] })] })] }));
         }
-        // ── License list (default overlay view) ──
         // Column widths: pick from terminal so long SPDX strings (e.g.
         // "(BSD-2-Clause OR MIT OR Apache-2.0)") don't blow the layout.
-        const innerCols = Math.max(60, termCols - 6);
+        const innerCols = Math.max(20, termCols - 6);
         const spdxCol = Math.min(40, Math.max(22, Math.floor(innerCols * 0.35)));
         const riskCol = 18;
         const countCol = 7;
         const barCol = Math.max(8, innerCols - spdxCol - riskCol - countCol - 4);
         const visibleRows = Math.max(5, termRows - 20);
         const cursor = Math.min(licenseCursor, licenseGroups.length - 1);
-        // Scrolling viewport: keep the cursor visible inside a window of
-        // `visibleRows` rows, clamped at the start/end. Replaces the prior
-        // "resize terminal to see all" dead end — ↑↓ now genuinely scrolls
-        // through the full list on any terminal height.
         const top = Math.max(0, Math.min(cursor - Math.floor((visibleRows - 1) / 2), licenseGroups.length - visibleRows));
         const bottom = Math.min(top + visibleRows, licenseGroups.length);
         const hiddenAbove = top;
         const hiddenBelow = licenseGroups.length - bottom;
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, total: total, flagged: flagged.length, clean: clean.length, userStatus: userStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsxs(Text, { bold: true, children: ["Licenses", " ", chalk.dim(`(${licenseGroups.length} unique across ${totalCount} packages)`)] }), _jsx(Text, { children: "" }), _jsxs(Box, { children: [_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { children: " " }) }), _jsx(Box, { width: spdxCol, flexShrink: 1, children: _jsx(Text, { dimColor: true, children: "SPDX" }) }), _jsx(Box, { width: riskCol, flexShrink: 0, children: _jsx(Text, { dimColor: true, children: "Risk" }) }), _jsx(Box, { width: countCol, flexShrink: 0, children: _jsx(Text, { dimColor: true, children: "Count" }) }), _jsx(Box, { width: barCol, flexShrink: 1, children: _jsx(Text, { dimColor: true, children: "Share" }) })] }), hiddenAbove > 0 && (_jsx(Text, { dimColor: true, children: `  ↑ ${hiddenAbove} more above` })), licenseGroups.slice(top, bottom).map((g, i) => {
+        return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: subviewCompact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 2, paddingRight: 2, width: "100%", children: [_jsxs(Text, { bold: true, children: ["Licenses", " ", chalk.dim(`(${licenseGroups.length} unique across ${totalCount} packages)`)] }), _jsx(Text, { children: "" }), _jsxs(Box, { children: [_jsx(Box, { width: 2, flexShrink: 0, children: _jsx(Text, { children: " " }) }), _jsx(Box, { width: spdxCol, flexShrink: 1, children: _jsx(Text, { dimColor: true, children: "SPDX" }) }), _jsx(Box, { width: riskCol, flexShrink: 0, children: _jsx(Text, { dimColor: true, children: "Risk" }) }), _jsx(Box, { width: countCol, flexShrink: 0, children: _jsx(Text, { dimColor: true, children: "Count" }) }), _jsx(Box, { width: barCol, flexShrink: 1, children: _jsx(Text, { dimColor: true, children: "Share" }) })] }), hiddenAbove > 0 && (_jsx(Text, { dimColor: true, children: `  ↑ ${hiddenAbove} more above` })), licenseGroups.slice(top, bottom).map((g, i) => {
                             const absIdx = top + i;
                             const color = lcColor(g.risk);
                             const barLen = Math.max(1, Math.round((g.count / maxCount) * (barCol - 2)));
@@ -1169,12 +1184,11 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
                             const spdxText = truncate(g.spdx, spdxCol - 1);
                             const riskText = g.risk;
                             if (isSelected) {
-                                return (_jsxs(Text, { backgroundColor: "#1a1a2e", children: [chalk.cyan("▌"), " ", chalk.bold(color(pad(spdxText, spdxCol))), chalk.dim(pad(riskText, riskCol)), chalk.bold(pad(String(g.count), countCol)), color(bar)] }, `${g.risk}::${g.spdx}::${absIdx}`));
+                                return (_jsxs(Text, { backgroundColor: "#1a1a2e", wrap: "truncate-end", children: [chalk.cyan("▌"), " ", chalk.bold(color(pad(spdxText, spdxCol))), chalk.dim(pad(riskText, riskCol)), chalk.bold(pad(String(g.count), countCol)), color(bar)] }, `${g.risk}::${g.spdx}::${absIdx}`));
                             }
-                            return (_jsxs(Text, { children: ["  ", color(pad(spdxText, spdxCol)), chalk.dim(pad(riskText, riskCol)), chalk.bold(pad(String(g.count), countCol)), color(bar)] }, `${g.risk}::${g.spdx}::${absIdx}`));
-                        }), hiddenBelow > 0 && (_jsx(Text, { dimColor: true, children: `  ↓ ${hiddenBelow} more below` }))] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("↑↓"), " ", chalk.dim("navigate"), "   ", chalk.bold.cyan("⏎"), " ", chalk.dim("view packages"), "   ", chalk.bold.cyan("e"), " ", chalk.dim("export"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("close"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit"), exportMsg && _jsxs(_Fragment, { children: ["   ", chalk.green(exportMsg)] })] })] }));
+                            return (_jsxs(Text, { wrap: "truncate-end", children: ["  ", color(pad(spdxText, spdxCol)), chalk.dim(pad(riskText, riskCol)), chalk.bold(pad(String(g.count), countCol)), color(bar)] }, `${g.risk}::${g.spdx}::${absIdx}`));
+                        }), hiddenBelow > 0 && (_jsx(Text, { dimColor: true, children: `  ↓ ${hiddenBelow} more below` }))] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("↑↓"), " ", chalk.dim("navigate"), "   ", chalk.bold.cyan("⏎"), " ", chalk.dim("view packages"), "   ", chalk.bold.cyan("e"), " ", chalk.dim("export"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("close"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit"), exportMsgText && _jsxs(_Fragment, { children: ["   ", exportMsgText] })] })] }));
     }
-    // ── Detail pane mode ──
     if (detailPane !== null) {
         const dpGroup = detailGroup;
         if (dpGroup) {
@@ -1184,11 +1198,10 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
             const dpAbove = dpScroll;
             const dpBelow = Math.max(0, detailLines.length - dpScroll - detailContentRows);
             const dpVisible = detailLines.slice(dpScroll, dpScroll + detailContentRows);
-            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, total: total, flagged: flagged.length, clean: clean.length, userStatus: userStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { bold: true, wrap: "truncate-end", children: [groupNames(dpGroup), dpRep.license ? chalk.dim(" \u00B7 ") + (dpRep.license.riskCategory === "permissive" ? chalk.green(dpRep.license.spdx ?? dpRep.license.raw ?? "") : dpRep.license.riskCategory === "no-license" || dpRep.license.riskCategory === "network-copyleft" ? chalk.red(dpRep.license.spdx ?? dpRep.license.raw ?? "No license") : chalk.yellow(dpRep.license.spdx ?? dpRep.license.raw ?? "")) : ""] }), _jsx(Text, { children: dpColor(`score ${dpRep.score}`) })] }), dpAbove > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2191"), " ", dpAbove, " more above"] })), _jsx(Box, { flexDirection: "column", marginLeft: 2, children: dpVisible }), dpBelow > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2193"), " ", dpBelow, " more below"] }))] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsx(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: _jsxs(Box, { justifyContent: "space-between", children: [clean.length > 0 ? (_jsxs(Text, { wrap: "truncate-end", children: [chalk.green("\u2713"), " ", chalk.green.bold(String(clean.length)), " ", chalk.dim(`package${clean.length !== 1 ? "s" : ""} passed`), " ", chalk.dim(`\u00b7 ${(durationMs / 1000).toFixed(1)}s`)] })) : (_jsxs(Text, { dimColor: true, children: [(durationMs / 1000).toFixed(1), "s"] })), result.freeScansRemaining !== undefined && (_jsx(Text, { dimColor: true, children: "Free tier \u00B7 dg login for higher scan limits" }))] }) }), _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("\u2191\u2193"), " ", chalk.dim("scroll"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("back"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit")] })] }));
+            return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: subviewCompact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { bold: true, wrap: "truncate-end", children: [groupNames(dpGroup), dpRep.license ? chalk.dim(" \u00B7 ") + (dpRep.license.riskCategory === "permissive" ? chalk.green(dpRep.license.spdx ?? dpRep.license.raw ?? "") : dpRep.license.riskCategory === "no-license" || dpRep.license.riskCategory === "network-copyleft" ? chalk.red(dpRep.license.spdx ?? dpRep.license.raw ?? "No license") : chalk.yellow(dpRep.license.spdx ?? dpRep.license.raw ?? "")) : ""] }), _jsx(Text, { children: dpColor(`score ${dpRep.score}`) })] }), dpAbove > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2191"), " ", dpAbove, " more above"] })), _jsx(Box, { flexDirection: "column", marginLeft: 2, children: dpVisible }), dpBelow > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2193"), " ", dpBelow, " more below"] }))] }), _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsx(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: _jsxs(Box, { justifyContent: "space-between", children: [clean.length > 0 ? (_jsxs(Text, { wrap: "truncate-end", children: [chalk.green("\u2713"), " ", chalk.green.bold(String(clean.length)), " ", chalk.dim(`package${clean.length !== 1 ? "s" : ""} passed`), " ", chalk.dim(`\u00b7 ${(durationMs / 1000).toFixed(1)}s`)] })) : (_jsxs(Text, { dimColor: true, children: [(durationMs / 1000).toFixed(1), "s"] })), result.freeScansRemaining !== undefined && (_jsx(Text, { dimColor: true, children: "Free tier \u00B7 dg login for higher scan limits" }))] }) }), _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), _jsxs(Text, { children: [" ", chalk.bold.cyan("\u2191\u2193"), " ", chalk.dim("scroll"), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("back"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit")] })] }));
         }
     }
-    // ── List mode ──
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, total: total, flagged: flagged.length, clean: clean.length, userStatus: userStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), groups.length > 0 && (_jsxs(_Fragment, { children: [!compact && _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { bold: true, children: searchQuery ? "Search Results" : "Flagged Packages" }), _jsx(Text, { dimColor: true, children: searchQuery ? `${matchCount} of ${total} packages` : `${clampedCursor + 1}/${groups.length}` })] }), aboveCount > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2191"), " ", aboveCount, " more above"] })), visibleGroups.map((group, visIdx) => {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(ScoreHeader, { score: result.score, action: result.action, compact: compact, total: total, flagged: flagged.length, clean: clean.length, userStatus: headerStatus, scanUsage: scanUsage, usageNearLimit: usageNearLimit }), groups.length > 0 && (_jsxs(_Fragment, { children: [!compact && _jsx(Text, { dimColor: true, children: chalk.dim("─".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { bold: true, children: searchQuery ? "Search Results" : "Flagged Packages" }), _jsx(Text, { dimColor: true, children: searchQuery ? `${matchCount} of ${total} packages` : `${clampedCursor + 1}/${groups.length}` })] }), aboveCount > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2191"), " ", aboveCount, " more above"] })), visibleGroups.map((group, visIdx) => {
                                 const globalIdx = view.viewport + visIdx;
                                 const isCursor = globalIdx === clampedCursor;
                                 const level = getLevel(globalIdx);
@@ -1204,13 +1217,17 @@ export const InteractiveResultsView = ({ result, config: _config, durationMs, on
                                             : chalk.yellow;
                                 const arrow = level === "summary" ? "\u25BE" : "\u25B8"; // ▾ expanded, ▸ collapsed
                                 return (_jsxs(Box, { flexDirection: "column", children: [isCursor ? (_jsxs(Text, { backgroundColor: "#1a1a2e", wrap: "truncate-end", children: [chalk.cyan("\u258C"), " ", chalk.cyan(arrow), " ", ` `, color(pad(label, BADGE_COL)), chalk.bold(pad(truncate(names, nameCol - 2), nameCol)), provenanceMarker(rep), lcColor(pad(lcStr, lcCol)), color(scoreStr.padStart(3)), "  "] })) : (_jsxs(Text, { wrap: "truncate-end", children: [`  ${chalk.dim(arrow)}  `, color(pad(label, BADGE_COL)), pad(truncate(names, nameCol - 2), nameCol), provenanceMarker(rep), lcColor(pad(lcStr, lcCol)), color(scoreStr.padStart(3))] })), level === "summary" && (_jsx(FindingsSummary, { group: group, maxWidth: innerWidth - 8, maxLines: group.key === view.expandedKey ? animVisibleLines : undefined }))] }, group.key));
-                            }), belowCount > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2193"), " ", belowCount, " more below"] }))] })] })), searchQuery && groups.length === 0 && (_jsx(Text, { dimColor: true, children: `  No packages match "${searchQuery}"` })), acked.length > 0 && !searchQuery && (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [_jsxs(Text, { bold: true, dimColor: true, children: ["Acknowledged (", acked.length, ") \\u00b7 dg.json"] }), ackGroups.slice(0, ACK_PREVIEW_LIMIT).map((group) => {
+                            }), belowCount > 0 && (_jsxs(Text, { dimColor: true, children: [chalk.cyan(" \u2193"), " ", belowCount, " more below"] }))] })] })), searchQuery && groups.length === 0 && (_jsx(Text, { dimColor: true, children: `  No packages match "${searchQuery}"` })), acked.length > 0 && !searchQuery && (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [_jsx(Text, { bold: true, dimColor: true, children: `Acknowledged (${acked.length}) \u00b7 dg.json` }), ackGroups.slice(0, ACK_PREVIEW_LIMIT).map((group) => {
                         const rep = firstPackage(group);
                         const ack = ackByKey.get(packageKey(rep.name, rep.version));
                         const who = ack?.by ?? "unknown";
                         const when = ack?.at ? ` on ${ack.at.slice(0, 10)}` : "";
                         return (_jsxs(Text, { dimColor: true, wrap: "truncate-end", children: ["  ", chalk.yellow("\u25b8"), " ", groupNames(group), "  ", chalk.dim(`accepted by ${who}${when}`)] }, `ack-${group.key}`));
-                    }), ackGroups.length > ACK_PREVIEW_LIMIT && (_jsx(Text, { dimColor: true, children: `  +${ackGroups.length - ACK_PREVIEW_LIMIT} more \u2014 dg decisions` }))] })), !compact && _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [discoveredTotal !== undefined && discoveredTotal > total && (_jsxs(Text, { dimColor: true, children: ["Scanned ", total, " of ", discoveredTotal, " packages"] })), acked.length > 0 && (_jsxs(Text, { wrap: "truncate-end", children: [chalk.yellow("\u26a0"), " ", chalk.yellow(String(acked.length)), " ", chalk.dim(`acknowledged warn${acked.length !== 1 ? "s" : ""} \u00b7 dg.json \u00b7 review with 'dg decisions'`)] })), _jsxs(Box, { justifyContent: "space-between", children: [clean.length > 0 ? (_jsxs(Text, { wrap: "truncate-end", children: [chalk.green("\u2713"), " ", chalk.green.bold(String(clean.length)), " ", chalk.dim(`package${clean.length !== 1 ? "s" : ""} passed`), " ", chalk.dim(`\u00b7 ${(durationMs / 1000).toFixed(1)}s`)] })) : (_jsxs(Text, { dimColor: true, children: [(durationMs / 1000).toFixed(1), "s"] })), result.freeScansRemaining !== undefined && (_jsx(Text, { dimColor: true, children: "Free tier \u00B7 dg login for higher scan limits" }))] })] }), !compact && _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), searchMode ? (_jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.bold.cyan("/"), " ", searchQuery, chalk.cyan("\u2588"), "   ", chalk.dim("Esc clear")] })) : exportMsg ? (_jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.green(exportMsg)] })) : searchQuery ? (_jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.bold.cyan("/"), " ", searchQuery, "   ", chalk.dim(`${matchCount} of ${total} packages`), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("clear"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit")] })) : (_jsxs(Text, { wrap: "truncate-end", children: [" ", groups.length > 0 && (_jsxs(_Fragment, { children: [chalk.bold.cyan("\u2191\u2193"), " ", chalk.dim("navigate"), "   ", chalk.bold.cyan("\u23CE"), " ", chalk.dim("expand"), "   "] })), total > 0 && (_jsxs(_Fragment, { children: [chalk.bold.cyan("/"), " ", chalk.dim("search"), "   "] })), chalk.bold.cyan("l"), " ", chalk.dim("licenses"), "   ", chalk.bold.cyan("e"), " ", chalk.dim("export"), "   ", onBack && _jsxs(_Fragment, { children: [chalk.bold.cyan("Esc"), " ", chalk.dim("back"), "   "] }), chalk.bold.cyan("q"), " ", chalk.dim("quit")] }))] }));
+                    }), ackGroups.length > ACK_PREVIEW_LIMIT && (_jsx(Text, { dimColor: true, children: `  +${ackGroups.length - ACK_PREVIEW_LIMIT} more \u2014 dg decisions` }))] })), !compact && _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), _jsxs(Box, { flexDirection: "column", paddingLeft: 1, paddingRight: 1, width: "100%", children: [discoveredTotal !== undefined && discoveredTotal > total && (_jsxs(Text, { dimColor: true, children: ["Scanned ", total, " of ", discoveredTotal, " packages"] })), acked.length > 0 && (_jsxs(Text, { wrap: "truncate-end", children: [chalk.yellow("\u26a0"), " ", chalk.yellow(String(acked.length)), " ", chalk.dim(`acknowledged warn${acked.length !== 1 ? "s" : ""} \u00b7 dg.json \u00b7 review with 'dg decisions'`)] })), _jsxs(Box, { justifyContent: "space-between", children: [clean.length > 0 ? (_jsxs(Text, { wrap: "truncate-end", children: [chalk.green("\u2713"), " ", chalk.green.bold(String(clean.length)), " ", chalk.dim(`package${clean.length !== 1 ? "s" : ""} passed`), " ", chalk.dim(`\u00b7 ${(durationMs / 1000).toFixed(1)}s`)] })) : (_jsxs(Text, { dimColor: true, children: [(durationMs / 1000).toFixed(1), "s"] })), result.freeScansRemaining !== undefined && (_jsx(Text, { dimColor: true, children: "Free tier \u00B7 dg login for higher scan limits" }))] })] }), !compact && _jsx(Text, { dimColor: true, children: chalk.dim("\u2500".repeat(Math.max(20, termCols - 4))) }), (() => {
+                const cur = groups.length > 0 ? groups[Math.min(view.cursor, groups.length - 1)] : undefined;
+                const page = cur ? packagePageUrl(firstPackage(cur).ecosystem ?? "", firstPackage(cur).name) : null;
+                return page ? _jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.dim(`\u2192 ${page}`)] }) : null;
+            })(), searchMode ? (_jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.bold.cyan("/"), " ", searchQuery, chalk.cyan("\u2588"), "   ", chalk.dim("Esc clear")] })) : exportMsg ? (_jsxs(Text, { wrap: "truncate-end", children: [" ", exportMsgText] })) : searchQuery ? (_jsxs(Text, { wrap: "truncate-end", children: [" ", chalk.bold.cyan("/"), " ", searchQuery, "   ", chalk.dim(`${matchCount} of ${total} packages`), "   ", chalk.bold.cyan("Esc"), " ", chalk.dim("clear"), "   ", chalk.bold.cyan("q"), " ", chalk.dim("quit")] })) : (_jsxs(Text, { wrap: "truncate-end", children: [" ", groups.length > 0 && (_jsxs(_Fragment, { children: [chalk.bold.cyan("\u2191\u2193"), " ", chalk.dim("navigate"), "   ", chalk.bold.cyan("\u23CE"), " ", chalk.dim("expand"), "   "] })), total > 0 && (_jsxs(_Fragment, { children: [chalk.bold.cyan("/"), " ", chalk.dim("search"), "   "] })), chalk.bold.cyan("l"), " ", chalk.dim("licenses"), "   ", chalk.bold.cyan("e"), " ", chalk.dim("export"), "   ", onBack && _jsxs(_Fragment, { children: [chalk.bold.cyan("Esc"), " ", chalk.dim("back"), "   "] }), chalk.bold.cyan("q"), " ", chalk.dim("quit")] }))] }));
 };
 const T = {
     branch: chalk.dim("\u251C\u2500\u2500"),
@@ -1246,7 +1263,6 @@ const FindingsSummary = ({ group, maxWidth, maxLines }) => {
         .sort((a, b) => b.severity - a.severity);
     const hasAffects = group.packages.length > 3;
     const allLines = [];
-    // License info
     const lcLine = licenseLine(rep);
     if (lcLine)
         allLines.push(lcLine);
@@ -1260,11 +1276,9 @@ const FindingsSummary = ({ group, maxWidth, maxLines }) => {
     //   Team: { category, severity, title, evidence } — show everything
     const isFree = visibleFindings.length > 0 && !visibleFindings[0]?.title;
     if (isFree) {
-        // Free tier: don't show raw category IDs — just the upgrade prompt
         allLines.push(_jsxs(Text, { dimColor: true, children: [hasAffects ? T.branch : T.last, " ", chalk.yellow("\u2192"), " ", chalk.yellow("Upgrade to Pro"), " for finding details"] }, "upgrade"));
     }
     else {
-        // Paid tier: show findings with category + title
         for (let idx = 0; idx < visibleFindings.length; idx++) {
             const f = visibleFindings[idx];
             if (!f)
@@ -1278,7 +1292,6 @@ const FindingsSummary = ({ group, maxWidth, maxLines }) => {
         }
     }
     if (visibleFindings.length === 0 && rep.score > 0) {
-        // No findings at all (shouldn't happen after API change, but safety fallback)
         allLines.push(_jsxs(Text, { dimColor: true, children: [hasAffects ? T.branch : T.last, " Score: ", rep.score, "/100"] }, "score-only"));
     }
     if (visibleFindings.length === 0 && rep.score === 0) {