@lunanoir/dep-lens 0.1.0

package/dist/ui/App.js

@@ -0,0 +1,148 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { writeFile } from 'node:fs/promises';
+import { useEffect, useMemo, useState } from 'react';
+import { Box, Text, useApp, useInput, useStdout } from 'ink';
+import { format } from '../i18n.js';
+import { buildSectionDivider, filterPackages, SORT_COLUMNS, sortPackages } from '../utils.js';
+import { DetailPane } from './DetailPane.js';
+import { ExportMenu, EXPORT_OPTION_COUNT } from './ExportMenu.js';
+import { FilterBar } from './FilterBar.js';
+import { Header } from './Header.js';
+import { HelpOverlay } from './HelpOverlay.js';
+import { useMessages } from './i18n-context.js';
+import { PackageTable } from './PackageTable.js';
+import { SummaryBar } from './SummaryBar.js';
+import { PALETTE } from './theme.js';
+const QUICK_FILTERS = {
+    '1': 'Permissive',
+    '2': 'WeakCopyleft',
+    '3': 'StrongCopyleft',
+    '4': 'Unknown',
+};
+const STATUS_CLEAR_MS = 4000;
+export function App({ report, version, getHtml }) {
+    const messages = useMessages();
+    const { exit } = useApp();
+    const { stdout } = useStdout();
+    const divider = buildSectionDivider(stdout.columns > 0 ? stdout.columns - 4 : 76);
+    const [mode, setMode] = useState('list');
+    const [query, setQuery] = useState('');
+    const [categoryFilter, setCategoryFilter] = useState(null);
+    const [sortIndex, setSortIndex] = useState(0);
+    const [descending, setDescending] = useState(false);
+    const [cursor, setCursor] = useState(0);
+    const [exportCursor, setExportCursor] = useState(0);
+    const [status, setStatus] = useState('');
+    useEffect(() => {
+        if (status.length === 0)
+            return;
+        const id = setTimeout(() => setStatus(''), STATUS_CLEAR_MS);
+        return () => clearTimeout(id);
+    }, [status]);
+    const sortColumn = SORT_COLUMNS[sortIndex] ?? 'name';
+    const visible = useMemo(() => sortPackages(filterPackages(report.packages, query, categoryFilter), sortColumn, descending), [report.packages, query, categoryFilter, sortColumn, descending]);
+    const maxCursor = Math.max(0, visible.length - 1);
+    const clampedCursor = Math.min(cursor, maxCursor);
+    const selectedPackage = visible[clampedCursor];
+    function exportSelection(index) {
+        const filename = index === 0 ? 'dep-lens-report.json' : 'dep-lens-report.html';
+        setStatus(format(messages.exportMenu.writing, { file: filename }));
+        const promise = index === 0
+            ? Promise.resolve(JSON.stringify(report, null, 2))
+            : getHtml();
+        promise
+            .then(async (content) => {
+            await writeFile(filename, content);
+            setStatus(format(messages.exportMenu.wrote, { file: filename }));
+        })
+            .catch((error) => {
+            setStatus(format(messages.exportMenu.failed, { error: String(error) }));
+        });
+    }
+    useInput((input, key) => {
+        if (mode === 'filter') {
+            if (key.return)
+                setMode('list');
+            else if (key.escape) {
+                setQuery('');
+                setMode('list');
+            }
+            else if (key.backspace || key.delete) {
+                setQuery(c => c.slice(0, -1));
+                setCursor(0);
+            }
+            else if (input.length > 0 && !key.ctrl && !key.meta) {
+                setQuery(c => c + input);
+                setCursor(0);
+            }
+            return;
+        }
+        if (mode === 'export') {
+            if (key.escape)
+                setMode('list');
+            else if (key.upArrow)
+                setExportCursor(c => Math.max(0, c - 1));
+            else if (key.downArrow)
+                setExportCursor(c => Math.min(EXPORT_OPTION_COUNT - 1, c + 1));
+            else if (key.return) {
+                exportSelection(exportCursor);
+                setMode('list');
+            }
+            return;
+        }
+        if (mode === 'detail' || mode === 'help') {
+            if (key.escape || key.return || input === 'q' || (mode === 'help' && input === 'h')) {
+                setMode('list');
+            }
+            return;
+        }
+        const quickFilter = QUICK_FILTERS[input];
+        if (quickFilter !== undefined) {
+            setCategoryFilter(c => c === quickFilter ? null : quickFilter);
+            setCursor(0);
+        }
+        else if (input === '0') {
+            setQuery('');
+            setCategoryFilter(null);
+            setCursor(0);
+        }
+        else if (input === 'q')
+            exit();
+        else if (input === 'f' || input === '/') {
+            setStatus('');
+            setMode('filter');
+        }
+        else if (input === 's')
+            setSortIndex(c => (c + 1) % SORT_COLUMNS.length);
+        else if (input === 'r')
+            setDescending(c => !c);
+        else if (input === 'e') {
+            setStatus('');
+            setExportCursor(0);
+            setMode('export');
+        }
+        else if (input === 'h' || input === '?')
+            setMode('help');
+        else if (input === 'g')
+            setCursor(0);
+        else if (input === 'G')
+            setCursor(maxCursor);
+        else if (key.return && selectedPackage !== undefined)
+            setMode('detail');
+        else if (key.upArrow)
+            setCursor(c => Math.max(0, c - 1));
+        else if (key.downArrow)
+            setCursor(c => Math.min(maxCursor, c + 1));
+        else if (key.pageUp)
+            setCursor(c => Math.max(0, c - 10));
+        else if (key.pageDown)
+            setCursor(c => Math.min(maxCursor, c + 10));
+    });
+    const activeFilters = [];
+    if (query.length > 0)
+        activeFilters.push(format(messages.filterText, { query }));
+    if (categoryFilter !== null)
+        activeFilters.push(format(messages.filterCategory, { category: messages.categories[categoryFilter] }));
+    const modeLabel = mode !== 'list' ? ` [${mode.toUpperCase()}] ` : '';
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [_jsx(Header, { project: report.project, version: version, scannedAt: report.scannedAt, summary: report.summary }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: PALETTE.dim, children: divider }) }), _jsx(Box, { marginTop: 1, marginBottom: 1, children: _jsx(SummaryBar, { summary: report.summary }) }), _jsx(PackageTable, { packages: visible, cursor: clampedCursor, sortColumn: sortColumn, descending: descending, query: query }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [mode === 'filter' && _jsx(FilterBar, { query: query }), mode === 'export' && _jsx(ExportMenu, { cursor: exportCursor }), mode === 'detail' && selectedPackage !== undefined && _jsx(DetailPane, { pkg: selectedPackage }), mode === 'help' && _jsx(HelpOverlay, {}), _jsx(Text, { color: PALETTE.dim, children: divider }), _jsxs(Text, { color: PALETTE.dim, children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: modeLabel }), activeFilters.length > 0 && mode !== 'filter' && _jsxs(Text, { color: PALETTE.ok, children: ["(", activeFilters.join(', '), ") "] }), status.length > 0 ? _jsxs(Text, { color: PALETTE.good, children: [status, " "] }) : messages.footer] })] })] }));
+}

package/dist/ui/DetailPane.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { format } from '../i18n.js';
+import { useMessages } from './i18n-context.js';
+import { categoryColor, commercialColor, PALETTE, riskColor } from './theme.js';
+function Row({ label, children }) {
+    return (_jsxs(Text, { children: [_jsx(Text, { color: PALETTE.dim, children: label.padEnd(12) }), children] }));
+}
+export function DetailPane({ pkg }) {
+    const messages = useMessages();
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "double", borderColor: PALETTE.brand, paddingX: 1, children: [_jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { bold: true, color: "black", backgroundColor: PALETTE.brand, children: [" ", pkg.name, "@", pkg.version, " "] }), _jsx(Text, { color: PALETTE.dim, children: messages.detail.hint })] }), _jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsxs(Row, { label: messages.detail.ecosystem, children: [_jsx(Text, { color: PALETTE.accent, children: pkg.ecosystem }), _jsxs(Text, { color: PALETTE.dim, children: [" (", messages.types[pkg.dependencyType], ")"] })] }), _jsxs(Row, { label: messages.detail.license, children: [_jsx(Text, { bold: true, children: pkg.license }), _jsxs(Text, { color: PALETTE.dim, children: [" - ", messages.sources[pkg.licenseSource]] })] }), _jsx(Row, { label: messages.detail.category, children: _jsx(Text, { color: categoryColor(pkg.category), bold: true, children: messages.categories[pkg.category] }) }), _jsx(Row, { label: messages.detail.risk, children: _jsx(Text, { color: riskColor(pkg.riskLevel), children: format(messages.detail.riskValue, {
+                                score: pkg.riskScore,
+                                level: messages.riskLevels[pkg.riskLevel],
+                            }) }) }), _jsx(Row, { label: messages.detail.commercial, children: _jsx(Text, { color: commercialColor(pkg.commercialUse), bold: true, children: messages.commercial[pkg.commercialUse].toUpperCase() }) })] }), _jsx(Box, { marginTop: 1, padding: 1, borderStyle: "single", borderColor: PALETTE.dim, children: _jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { bold: true, italic: true, color: PALETTE.dim, children: [messages.detail.advice, ":"] }), _jsx(Text, { children: messages.advice[pkg.category] })] }) })] }));
+}

package/dist/ui/ErrorScreen.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useApp, useInput } from 'ink';
+import { useMessages } from './i18n-context.js';
+import { PALETTE } from './theme.js';
+export function ErrorScreen({ message }) {
+    const messages = useMessages();
+    const { exit } = useApp();
+    useInput((input, key) => {
+        if (input === 'q' || key.escape || key.return) {
+            exit();
+        }
+    });
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "classic", borderColor: PALETTE.bad, paddingX: 2, paddingY: 1, children: [_jsx(Text, { bold: true, color: PALETTE.bad, children: messages.error.title }), _jsx(Text, { children: message }), _jsx(Text, { color: PALETTE.dim, children: messages.error.hint })] }));
+}

package/dist/ui/ExportMenu.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { useMessages } from './i18n-context.js';
+import { PALETTE } from './theme.js';
+export const EXPORT_OPTION_COUNT = 3;
+export function ExportMenu({ cursor }) {
+    const messages = useMessages();
+    const options = [
+        messages.exportMenu.json,
+        messages.exportMenu.html,
+        messages.exportMenu.cancel,
+    ];
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "classic", borderColor: PALETTE.brand, paddingX: 1, children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: messages.exportMenu.title }), options.map((option, index) => (_jsxs(Text, { color: index === cursor ? PALETTE.accent : undefined, inverse: index === cursor, children: [index === cursor ? '> ' : '  ', option] }, option)))] }));
+}

package/dist/ui/FilterBar.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { useMessages } from './i18n-context.js';
+import { PALETTE } from './theme.js';
+export function FilterBar({ query }) {
+    const messages = useMessages();
+    return (_jsx(Box, { borderStyle: "classic", borderColor: PALETTE.brand, paddingX: 1, children: _jsxs(Text, { children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: messages.filterBar.label }), query, _jsx(Text, { inverse: true, children: " " }), _jsx(Text, { color: PALETTE.dim, children: messages.filterBar.hint })] }) }));
+}

package/dist/ui/Header.js

@@ -0,0 +1,37 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useStdout } from 'ink';
+import { calculateHealthScore } from '../utils.js';
+import { useMessages } from './i18n-context.js';
+import { healthColor, HEALTH_GOOD_THRESHOLD, HEALTH_OK_THRESHOLD, PALETTE, } from './theme.js';
+const FACE_TOP = '╭───────╮';
+const FACE_BOTTOM = '╰───────╯';
+// Visible columns the score bar is inset by: indent + face box + gap.
+const FACE_INDENT = '  ';
+const FACE_OFFSET = FACE_INDENT.length + FACE_TOP.length + FACE_INDENT.length;
+const BAR_MIN_WIDTH = 10;
+function faceLines(score) {
+    if (score >= HEALTH_GOOD_THRESHOLD)
+        return ['◉   ◉', '  ◠  '];
+    if (score >= HEALTH_OK_THRESHOLD)
+        return ['◉   ◉', '  ─  '];
+    return ['✕   ✕', '  ◡  '];
+}
+function healthLabel(score, messages) {
+    if (score >= HEALTH_GOOD_THRESHOLD)
+        return messages.header.health.good;
+    if (score >= HEALTH_OK_THRESHOLD)
+        return messages.header.health.ok;
+    return messages.header.health.poor;
+}
+export function Header({ project, version, scannedAt, summary }) {
+    const messages = useMessages();
+    const { stdout } = useStdout();
+    const terminalWidth = stdout.columns > 0 ? stdout.columns : 80;
+    const score = calculateHealthScore(summary);
+    const color = healthColor(score);
+    const [eyes, mouth] = faceLines(score);
+    const barWidth = Math.max(BAR_MIN_WIDTH, terminalWidth - FACE_OFFSET - 4);
+    const filled = Math.round((score / 100) * barWidth);
+    const empty = Math.max(0, barWidth - filled);
+    return (_jsx(Box, { flexDirection: "column", children: _jsxs(Box, { children: [_jsxs(Box, { flexDirection: "column", marginRight: 2, children: [_jsx(Text, { color: color, children: FACE_TOP }), _jsxs(Text, { color: color, children: ["\u2502 ", eyes, " \u2502"] }), _jsxs(Text, { color: color, children: ["\u2502 ", mouth, " \u2502"] }), _jsx(Text, { color: color, children: FACE_BOTTOM })] }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { bold: true, color: color, children: score }), _jsx(Text, { color: PALETTE.dim, children: " / 100 " }), _jsx(Text, { bold: true, color: color, children: healthLabel(score, messages) })] }), _jsxs(Text, { children: [_jsx(Text, { color: color, children: '█'.repeat(filled) }), _jsx(Text, { color: PALETTE.dim, children: '░'.repeat(empty) })] }), _jsxs(Text, { children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: "DEP-LENS" }), _jsxs(Text, { color: PALETTE.dim, children: [" v", version, " "] }), _jsx(Text, { color: PALETTE.accent, children: project })] }), _jsxs(Text, { color: PALETTE.dim, children: [messages.header.scanned, " ", scannedAt, " \u00B7 ", summary.total, " ", messages.header.packages] })] })] }) }));
+}

package/dist/ui/HelpOverlay.js

@@ -0,0 +1,11 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { useMessages } from './i18n-context.js';
+import { PALETTE } from './theme.js';
+export function HelpOverlay() {
+    const messages = useMessages();
+    const half = Math.ceil(messages.help.bindings.length / 2);
+    const left = messages.help.bindings.slice(0, half);
+    const right = messages.help.bindings.slice(half);
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "double", borderColor: PALETTE.accent, paddingX: 2, paddingY: 1, children: [_jsxs(Text, { bold: true, color: PALETTE.accent, children: [" ", messages.help.title.toUpperCase(), " "] }), _jsxs(Box, { marginTop: 1, children: [_jsx(Box, { flexDirection: "column", width: "50%", children: left.map(([key, description]) => (_jsxs(Text, { children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: key.padEnd(12) }), _jsx(Text, { children: description })] }, key))) }), _jsx(Box, { flexDirection: "column", width: "50%", children: right.map(([key, description]) => (_jsxs(Text, { children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: key.padEnd(12) }), _jsx(Text, { children: description })] }, key))) })] })] }));
+}

package/dist/ui/PackageTable.js

@@ -0,0 +1,118 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useStdout } from 'ink';
+import { format } from '../i18n.js';
+import { pad } from '../utils.js';
+import { useRevealOnce } from './hooks.js';
+import { useMessages } from './i18n-context.js';
+import { categoryColor, PALETTE } from './theme.js';
+/**
+ * Column widths adapt to the terminal: version/category/risk/commercial are
+ * fixed, the remainder is split between name (60%) and license (40%).
+ */
+export function computeColumns(terminalWidth, messages) {
+    const fixed = [
+        { key: 'version', label: messages.table.version, width: 9 },
+        { key: 'category', label: messages.table.category, width: 16 },
+        { key: 'dependencyType', label: messages.table.type, width: 10 },
+        { key: 'riskScore', label: messages.table.risk, width: 7 },
+        { key: 'commercialUse', label: messages.table.commercial, width: 12 },
+    ];
+    const fixedTotal = fixed.reduce((sum, column) => sum + column.width, 0);
+    const separators = 6; // 7 columns
+    const chrome = 4; // table border plus horizontal padding
+    const flexible = Math.max(terminalWidth - chrome - separators - fixedTotal, 16);
+    const nameWidth = Math.max(Math.floor(flexible * 0.6), 10);
+    const licenseWidth = Math.max(flexible - nameWidth, 6);
+    const columns = [
+        { key: 'name', label: messages.table.package, width: nameWidth },
+        { key: 'license', label: messages.table.license, width: licenseWidth },
+        ...fixed,
+    ];
+    return columns.sort((a, b) => ORDER.indexOf(a.key) - ORDER.indexOf(b.key));
+}
+const ORDER = [
+    'name',
+    'version',
+    'license',
+    'category',
+    'dependencyType',
+    'riskScore',
+    'commercialUse',
+];
+function cellValue(pkg, key, messages) {
+    switch (key) {
+        case 'name':
+            return pkg.name;
+        case 'version':
+            return pkg.version;
+        case 'license':
+            return pkg.license;
+        case 'category':
+            return messages.categories[pkg.category];
+        case 'dependencyType':
+            return messages.types[pkg.dependencyType];
+        case 'riskScore':
+            return String(pkg.riskScore);
+        case 'commercialUse':
+            return messages.commercial[pkg.commercialUse];
+    }
+}
+export function PackageTable({ packages, cursor, sortColumn, descending, viewport = 12, query = '', }) {
+    const messages = useMessages();
+    const { stdout } = useStdout();
+    const columns = computeColumns(stdout.columns > 0 ? stdout.columns : 80, messages);
+    const revealed = useRevealOnce(viewport);
+    const start = Math.max(0, Math.min(cursor - Math.floor(viewport / 2), packages.length - viewport));
+    const rows = packages.slice(start, start + Math.min(viewport, revealed));
+    const header = columns
+        .map((column) => {
+        const marker = column.key === sortColumn ? (descending ? ' v' : ' ^') : '';
+        return pad(`${column.label}${marker}`, column.width);
+    })
+        .join(' ');
+    const scrollbarHeight = Math.min(viewport, packages.length);
+    const scrollbarThumbHeight = Math.max(1, Math.floor((scrollbarHeight / Math.max(1, packages.length)) * scrollbarHeight));
+    const scrollbarThumbTop = packages.length > viewport
+        ? Math.floor((start / Math.max(1, packages.length - viewport)) * (scrollbarHeight - scrollbarThumbHeight))
+        : 0;
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: PALETTE.dim, paddingX: 1, children: [_jsx(Text, { bold: true, color: PALETTE.brand, underline: true, children: header }), _jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { flexDirection: "column", flexGrow: 1, children: rows.length === 0 ? (_jsx(Text, { color: PALETTE.dim, children: messages.table.empty })) : (rows.map((pkg, index) => {
+                            const absoluteIndex = start + index;
+                            const selected = absoluteIndex === cursor;
+                            const line = columns
+                                .map((column) => {
+                                const val = cellValue(pkg, column.key, messages);
+                                return pad(val, column.width);
+                            })
+                                .join(' ');
+                            if (selected) {
+                                return (_jsx(Text, { color: categoryColor(pkg.category), inverse: true, children: line }, `${pkg.ecosystem}:${pkg.name}@${pkg.version}`));
+                            }
+                            // Search highlighting for unselected rows
+                            if (query.length > 0) {
+                                const needle = query.toLowerCase();
+                                const parts = [];
+                                let lastIndex = 0;
+                                const lowerLine = line.toLowerCase();
+                                let matchIndex = lowerLine.indexOf(needle);
+                                while (matchIndex !== -1) {
+                                    parts.push(line.slice(lastIndex, matchIndex));
+                                    parts.push(_jsx(Text, { underline: true, bold: true, color: PALETTE.brand, children: line.slice(matchIndex, matchIndex + needle.length) }, matchIndex));
+                                    lastIndex = matchIndex + needle.length;
+                                    matchIndex = lowerLine.indexOf(needle, lastIndex);
+                                }
+                                parts.push(line.slice(lastIndex));
+                                return (_jsx(Text, { color: categoryColor(pkg.category), children: parts }, `${pkg.ecosystem}:${pkg.name}@${pkg.version}`));
+                            }
+                            return (_jsx(Text, { color: categoryColor(pkg.category), children: line }, `${pkg.ecosystem}:${pkg.name}@${pkg.version}`));
+                        })) }), packages.length > viewport && (_jsx(Box, { flexDirection: "column", width: 1, marginLeft: 1, children: Array.from({ length: scrollbarHeight }).map((_, i) => (_jsx(Text, { color: i >= scrollbarThumbTop && i < scrollbarThumbTop + scrollbarThumbHeight
+                                ? PALETTE.brand
+                                : PALETTE.dim, children: i >= scrollbarThumbTop && i < scrollbarThumbTop + scrollbarThumbHeight
+                                ? '┃'
+                                : '│' }, i))) }))] }), _jsxs(Box, { justifyContent: "space-between", children: [_jsx(Text, { color: PALETTE.dim, children: packages.length === 0
+                            ? format(messages.table.rows, { start: 0, end: 0, total: 0 })
+                            : format(messages.table.rows, {
+                                start: start + 1,
+                                end: start + rows.length,
+                                total: packages.length,
+                            }) }), _jsx(Text, { color: PALETTE.dim, children: messages.table.rows.includes(' / ') ? `sıralama: ${sortColumn}` : `sort: ${sortColumn}` })] })] }));
+}

package/dist/ui/Root.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { getMessages } from '../i18n.js';
+import { App } from './App.js';
+import { ErrorScreen } from './ErrorScreen.js';
+import { I18nContext } from './i18n-context.js';
+import { ScanningScreen } from './ScanningScreen.js';
+/**
+ * Top-level TUI component: runs the scan with an animated progress screen,
+ * then hands over to the interactive report, all under the chosen locale.
+ */
+export function Root({ locale, version, scan, getHtml, onReport, onError, }) {
+    const [phase, setPhase] = useState({ name: 'scanning' });
+    useEffect(() => {
+        let cancelled = false;
+        scan()
+            .then((report) => {
+            if (!cancelled) {
+                onReport(report);
+                setPhase({ name: 'ready', report });
+            }
+        })
+            .catch((error) => {
+            if (!cancelled) {
+                onError();
+                setPhase({
+                    name: 'error',
+                    message: error instanceof Error ? error.message : String(error),
+                });
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+        // The scan runs exactly once for the lifetime of the TUI.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return (_jsxs(I18nContext.Provider, { value: getMessages(locale), children: [phase.name === 'scanning' ? _jsx(ScanningScreen, { version: version }) : null, phase.name === 'error' ? _jsx(ErrorScreen, { message: phase.message }) : null, phase.name === 'ready' ? _jsx(App, { report: phase.report, version: version, getHtml: getHtml }) : null] }));
+}

package/dist/ui/ScanningScreen.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Box, Text } from 'ink';
+import { format } from '../i18n.js';
+import { useDots, useSpinner } from './hooks.js';
+import { useMessages } from './i18n-context.js';
+import { PALETTE } from './theme.js';
+const FACE_TOP = '╭───────╮';
+const FACE_BOTTOM = '╰───────╯';
+export function ScanningScreen({ version }) {
+    const messages = useMessages();
+    const spinner = useSpinner();
+    const dots = useDots();
+    const [seconds, setSeconds] = useState(0);
+    useEffect(() => {
+        const id = setInterval(() => {
+            setSeconds((value) => value + 1);
+        }, 1000);
+        return () => {
+            clearInterval(id);
+        };
+    }, []);
+    const barWidth = 30;
+    const filled = (seconds % barWidth) + 1;
+    return (_jsx(Box, { flexDirection: "column", paddingX: 2, paddingY: 1, children: _jsxs(Box, { children: [_jsxs(Box, { flexDirection: "column", marginRight: 2, children: [_jsx(Text, { color: PALETTE.brand, children: FACE_TOP }), _jsxs(Text, { color: PALETTE.brand, children: ["\u2502 ", spinner, "   ", spinner, " \u2502"] }), _jsx(Text, { color: PALETTE.brand, children: "\u2502   \u25E0   \u2502" }), _jsx(Text, { color: PALETTE.brand, children: FACE_BOTTOM })] }), _jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { children: [_jsx(Text, { bold: true, color: PALETTE.brand, children: "DEP-LENS" }), _jsxs(Text, { color: PALETTE.dim, children: [" v", version] })] }), _jsxs(Text, { children: [_jsx(Text, { color: PALETTE.brand, children: '█'.repeat(filled) }), _jsx(Text, { color: PALETTE.dim, children: '░'.repeat(barWidth - filled) })] }), _jsxs(Text, { bold: true, children: [messages.scanning.title, dots] }), _jsx(Text, { color: PALETTE.dim, children: format(messages.scanning.elapsed, { seconds }) })] })] }) }));
+}

package/dist/ui/SummaryBar.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useStdout } from 'ink';
+import { buildRatioSegments, percent } from '../utils.js';
+import { useAnimatedNumber } from './hooks.js';
+import { useMessages } from './i18n-context.js';
+import { PALETTE } from './theme.js';
+function AnimatedEntry({ label, count, total, color, }) {
+    const animated = useAnimatedNumber(count);
+    return (_jsxs(Text, { children: [_jsx(Text, { color: color, bold: true, children: label }), ' ', animated, " (", percent(animated, total), "%)"] }));
+}
+export function SummaryBar({ summary }) {
+    const messages = useMessages();
+    const { stdout } = useStdout();
+    const terminalWidth = stdout.columns > 0 ? stdout.columns : 80;
+    const { total } = summary;
+    // The bar fill grows with the same easing as the counters.
+    const progress = useAnimatedNumber(1000, 900) / 1000;
+    const barWidth = Math.max(20, terminalWidth - 4);
+    const segments = buildRatioSegments(summary, barWidth, progress);
+    const entries = [
+        { label: messages.summaryShort.Permissive, count: summary.permissive, color: PALETTE.good },
+        { label: messages.summaryShort.WeakCopyleft, count: summary.weakCopyleft, color: PALETTE.ok },
+        {
+            label: messages.summaryShort.StrongCopyleft,
+            count: summary.strongCopyleft,
+            color: PALETTE.bad,
+        },
+        { label: messages.summaryShort.Unknown, count: summary.unknown, color: PALETTE.unknown },
+    ];
+    return (_jsxs(Box, { flexDirection: "column", paddingX: 1, children: [_jsx(Box, { gap: 2, children: entries.map((entry) => (_jsx(AnimatedEntry, { label: entry.label, count: entry.count, total: total, color: entry.color }, entry.label))) }), _jsx(Text, { children: segments.map((segment) => (_jsx(Text, { color: segment.color, children: segment.char.repeat(segment.width) }, segment.category))) })] }));
+}

package/dist/ui/hooks.js

@@ -0,0 +1,85 @@
+import { useEffect, useRef, useState } from 'react';
+export const SPINNER_FRAMES = ['|', '/', '-', '\\'];
+/** Classic ASCII spinner; advances one frame per interval. */
+export function useSpinner(intervalMs = 90) {
+    const [tick, setTick] = useState(0);
+    useEffect(() => {
+        const id = setInterval(() => {
+            setTick((value) => value + 1);
+        }, intervalMs);
+        return () => {
+            clearInterval(id);
+        };
+    }, [intervalMs]);
+    return SPINNER_FRAMES[tick % SPINNER_FRAMES.length] ?? '|';
+}
+/** Animated trailing dots: "", ".", "..", "..." looping. */
+export function useDots(intervalMs = 300) {
+    const [tick, setTick] = useState(0);
+    useEffect(() => {
+        const id = setInterval(() => {
+            setTick((value) => value + 1);
+        }, intervalMs);
+        return () => {
+            clearInterval(id);
+        };
+    }, [intervalMs]);
+    return '.'.repeat(tick % 4);
+}
+export function easeOutCubic(t) {
+    return 1 - (1 - t) ** 3;
+}
+/**
+ * Count from 0 to `target` with an ease-out curve. Re-animates when the
+ * target changes (e.g. after filtering).
+ */
+export function useAnimatedNumber(target, durationMs = 700) {
+    const [value, setValue] = useState(0);
+    useEffect(() => {
+        if (target === 0) {
+            setValue(0);
+            return undefined;
+        }
+        const startedAt = Date.now();
+        const id = setInterval(() => {
+            const t = Math.min(1, (Date.now() - startedAt) / durationMs);
+            setValue(Math.round(target * easeOutCubic(t)));
+            if (t >= 1) {
+                clearInterval(id);
+            }
+        }, 40);
+        return () => {
+            clearInterval(id);
+        };
+    }, [target, durationMs]);
+    return value;
+}
+/**
+ * Reveal `total` items progressively, one per interval, exactly once per
+ * component lifetime (table rows slide in on first render only).
+ */
+export function useRevealOnce(total, stepMs = 25) {
+    const done = useRef(false);
+    const [count, setCount] = useState(done.current ? total : 1);
+    useEffect(() => {
+        if (done.current) {
+            return undefined;
+        }
+        const id = setInterval(() => {
+            setCount((current) => {
+                if (current + 1 >= total) {
+                    done.current = true;
+                    clearInterval(id);
+                    return total;
+                }
+                return current + 1;
+            });
+        }, stepMs);
+        return () => {
+            clearInterval(id);
+        };
+        // Intentionally run once: this is an entrance animation, not a sync.
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return done.current ? total : Math.max(1, count);
+}

package/dist/ui/i18n-context.js

@@ -0,0 +1,6 @@
+import { createContext, useContext } from 'react';
+import { EN } from '../i18n.js';
+export const I18nContext = createContext(EN);
+export function useMessages() {
+    return useContext(I18nContext);
+}

package/dist/ui/theme.js

@@ -0,0 +1,59 @@
+/**
+ * Color policy: strong copyleft and other risky entries are red, items
+ * needing caution are amber, safe entries are green, unidentifiable
+ * entries are slate. Truecolor hex values (rendered via chalk) for a
+ * richer palette than the default ANSI 16; no emoji anywhere in the UI.
+ */
+export const PALETTE = {
+    good: '#4ade80', // emerald
+    ok: '#fbbf24', // amber
+    bad: '#fb7185', // rose
+    unknown: '#94a3b8', // slate
+    brand: '#38bdf8', // sky
+    accent: '#a78bfa', // violet
+    dim: '#64748b', // slate (dim text)
+};
+/** Health score thresholds (0-100) shared by the header face and bar. */
+export const HEALTH_GOOD_THRESHOLD = 80;
+export const HEALTH_OK_THRESHOLD = 50;
+export function healthColor(score) {
+    if (score >= HEALTH_GOOD_THRESHOLD)
+        return PALETTE.good;
+    if (score >= HEALTH_OK_THRESHOLD)
+        return PALETTE.ok;
+    return PALETTE.bad;
+}
+export function categoryColor(category) {
+    switch (category) {
+        case 'Permissive':
+            return PALETTE.good;
+        case 'WeakCopyleft':
+            return PALETTE.ok;
+        case 'StrongCopyleft':
+            return PALETTE.bad;
+        case 'Unknown':
+            return PALETTE.unknown;
+    }
+}
+export function riskColor(level) {
+    switch (level) {
+        case 'low':
+            return PALETTE.good;
+        case 'medium':
+            return PALETTE.ok;
+        case 'high':
+            return PALETTE.bad;
+    }
+}
+export function commercialColor(use) {
+    switch (use) {
+        case 'yes':
+            return PALETTE.good;
+        case 'caution':
+            return PALETTE.ok;
+        case 'restricted':
+            return PALETTE.bad;
+        case 'review':
+            return PALETTE.unknown;
+    }
+}