@ohzw/worktree-command-tui 0.1.0 → 0.1.2

package/dist/components/ActionPanel.js

@@ -1,129 +1,188 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Text } from 'ink';
-function formatTags(tags) {
-    return tags.length === 0 ? '-' : tags.join(' · ');
-}
-function sanitizeInlineText(value) {
-    return value
-        .replace(/[\r\n\t\u2028\u2029]+/g, ' ')
-        .replace(/[\u0000-\u001f\u007f-\u009f]/g, '')
-        .replace(/\p{Cf}/gu, '')
-        .replace(/\s+/g, ' ')
-        .trim();
+import { getOrderedNonActiveTags, projectAction, projectNote, projectPullRequest, projectUpstream, projectWorkingTree, sanitizeInlineText, } from '../core/worktree-projection.js';
+import { getScrollbarThumbRows, sliceListViewport } from '../terminal/viewport.js';
+export function getActionVariant(selectedRow, activePath) {
+    return projectAction(selectedRow, activePath).severity;
 }
 function formatUpstream(selectedRow) {
-    if (selectedRow.upstreamUnavailable) {
+    const upstream = projectUpstream(selectedRow);
+    if (upstream.kind === 'unavailable') {
         return 'unavailable';
     }
-    if (!selectedRow.upstream) {
+    if (upstream.kind === 'none') {
         return '-';
     }
-    return `${sanitizeInlineText(selectedRow.upstream.branch)} (↑${selectedRow.upstream.ahead} ↓${selectedRow.upstream.behind})`;
+    return `${upstream.branch} (↑${upstream.ahead} ↓${upstream.behind})`;
 }
-function formatWorkingTree(selectedRow) {
-    if (!selectedRow.workingTree) {
-        return 'unavailable';
+function getTagColor(tag) {
+    if (tag === 'active') {
+        return 'green';
     }
-    const { staged, unstaged, untracked, conflicts } = selectedRow.workingTree;
-    if (staged === 0 && unstaged === 0 && untracked === 0 && conflicts === 0) {
-        return 'clean';
+    if (tag === 'external') {
+        return 'yellow';
     }
-    const parts = [];
-    if (staged > 0) {
-        parts.push(`index ${staged}`);
+    if (tag === 'main') {
+        return 'blue';
     }
-    if (unstaged > 0) {
-        parts.push(`worktree ${unstaged}`);
+    if (tag === 'invalid') {
+        return 'red';
     }
-    if (untracked > 0) {
-        parts.push(`untracked ${untracked}`);
+    return 'magenta';
+}
+function getTagLabel(tag) {
+    return tag === 'main' ? 'root' : tag;
+}
+function getWorkingTreePartLabel(kind) {
+    if (kind === 'staged') {
+        return 'index';
     }
-    if (conflicts > 0) {
-        parts.push(`conflicts ${conflicts}`);
+    if (kind === 'unstaged') {
+        return 'worktree';
     }
-    return `dirty (${parts.join(' · ')})`;
+    return kind;
 }
-function formatPullRequest(selectedRow) {
-    if (!selectedRow.pullRequest || selectedRow.pullRequest.kind === 'none') {
-        return 'none';
-    }
-    if (selectedRow.pullRequest.kind === 'unavailable') {
+function formatWorkingTree(selectedRow) {
+    const workingTree = projectWorkingTree(selectedRow);
+    if (workingTree.kind === 'unavailable') {
         return 'unavailable';
     }
-    const draft = selectedRow.pullRequest.isDraft ? 'draft/' : '';
-    return `#${selectedRow.pullRequest.number} ${draft}${selectedRow.pullRequest.state.toLowerCase()} → ${sanitizeInlineText(selectedRow.pullRequest.baseBranch)}`;
-}
-function getPullRequestLabel(selectedRow) {
-    if (selectedRow.pullRequest?.kind === 'found' && selectedRow.pullRequest.state !== 'OPEN') {
-        return 'Last PR';
+    if (workingTree.kind === 'clean') {
+        return 'clean';
     }
-    return 'PR';
+    const parts = workingTree.parts.map(part => `${getWorkingTreePartLabel(part.kind)} ${part.count}`);
+    return `dirty (${parts.join(' · ')})`;
 }
-function getPullRequestTitleLabel(selectedRow) {
-    if (selectedRow.pullRequest?.kind === 'found' && selectedRow.pullRequest.state !== 'OPEN') {
-        return 'Last PR Title';
+function formatUtcDateTime(timestampMs) {
+    if (timestampMs === undefined || !Number.isFinite(timestampMs)) {
+        return '-';
     }
-    return 'PR Title';
+    const iso = new Date(timestampMs).toISOString();
+    return `${iso.slice(0, 10)} ${iso.slice(11, 19)} UTC`;
 }
-export function getPullRequestColor(selectedRow) {
-    if (!selectedRow.pullRequest || selectedRow.pullRequest.kind === 'none') {
-        return undefined;
+function formatPullRequest(selectedRow) {
+    const pullRequest = projectPullRequest(selectedRow);
+    if (pullRequest.kind === 'none') {
+        return 'none';
+    }
+    if (pullRequest.kind === 'unavailable') {
+        return 'unavailable';
     }
-    if (selectedRow.pullRequest.kind === 'unavailable') {
+    const draft = pullRequest.isDraft ? 'draft/' : '';
+    const stateText = pullRequest.state.toLowerCase();
+    return `#${pullRequest.number} ${draft}${stateText} → ${pullRequest.baseBranch}`;
+}
+function getPullRequestColorFromProjection(pullRequest) {
+    if (pullRequest.kind === 'unavailable') {
         return 'red';
     }
-    if (selectedRow.pullRequest.state !== 'OPEN') {
+    if (pullRequest.kind !== 'found' || pullRequest.isHistorical) {
         return undefined;
     }
-    return selectedRow.pullRequest.isDraft ? 'yellow' : 'green';
+    return pullRequest.isDraft ? 'yellow' : 'green';
+}
+export function getPullRequestColor(selectedRow) {
+    return getPullRequestColorFromProjection(projectPullRequest(selectedRow));
+}
+function getPullRequestLabel(pullRequest) {
+    return pullRequest.kind === 'found' && pullRequest.isHistorical ? 'Last PR' : 'PR';
+}
+function getPullRequestTitleLabel(pullRequest) {
+    return pullRequest.kind === 'found' && pullRequest.isHistorical ? 'Last PR Title' : 'PR Title';
+}
+function getPullRequestDimColor(pullRequest) {
+    return pullRequest.kind === 'found' && pullRequest.isHistorical;
 }
 function getActionMessage(selectedRow, activePath) {
-    if (selectedRow.invalidReason) {
+    const action = projectAction(selectedRow, activePath);
+    if (action.kind === 'blocked') {
         return 'Cannot start this worktree.';
     }
-    if (selectedRow.path === activePath) {
+    if (action.kind === 'active') {
         return 'Already active. Press s to stop the current session.';
     }
     return 'Press Enter to start here and switch the active session.';
 }
-export function getActionColor(selectedRow) {
-    if (selectedRow.invalidReason) {
-        return 'red';
-    }
-    if ((selectedRow.workingTree?.conflicts ?? 0) > 0) {
-        return 'red';
+function getNotes(selectedRow) {
+    const note = projectNote(selectedRow);
+    if (note.kind === 'invalid') {
+        return note.invalidReason;
     }
-    if ((selectedRow.workingTree?.staged ?? 0) > 0
-        || (selectedRow.workingTree?.unstaged ?? 0) > 0
-        || (selectedRow.workingTree?.untracked ?? 0) > 0) {
-        return 'yellow';
+    if (note.kind === 'external') {
+        return 'External worktree managed outside the main checkout path.';
     }
-    return undefined;
+    return 'Ready to launch with the configured command in this worktree.';
 }
-function getNotes(selectedRow) {
-    if (selectedRow.invalidReason) {
-        return selectedRow.invalidReason;
+function getVariantColor(variant) {
+    if (variant === 'success') {
+        return 'green';
     }
-    if (selectedRow.tags.includes('external')) {
-        return 'External worktree managed outside the main checkout path.';
+    if (variant === 'error') {
+        return 'red';
     }
-    if (selectedRow.tags.includes('active')) {
-        return 'This worktree currently owns the running command session.';
+    return 'blue';
+}
+function getVariantIcon(variant) {
+    if (variant === 'success') {
+        return '✓';
     }
-    return 'Ready to launch with the configured command in this worktree.';
+    if (variant === 'error') {
+        return '✘';
+    }
+    return 'ℹ';
 }
-function SectionHeader({ label }) {
-    return (_jsxs(Text, { bold: true, color: "cyan", children: ["[", label, "]"] }));
+function section(label) {
+    return { text: `[${label}]`, color: 'cyan', bold: true };
 }
-export function ActionPanel({ selectedRow, activePath, stacked, width, compactDetails, }) {
+function divider() {
+    return { text: ' ', dimColor: true };
+}
+function getPanelLines(selectedRow, activePath, setupAvailable, compactDetails) {
     if (!selectedRow) {
-        return (_jsxs(Box, { width: width, flexGrow: stacked ? 0 : 1, flexShrink: 1, borderStyle: "round", borderColor: "magenta", flexDirection: "column", paddingX: 1, children: [_jsx(Text, { bold: true, color: "magenta", children: "Selection / Action" }), _jsx(Text, { dimColor: true, children: "No worktrees found." })] }));
+        return [{ text: 'No worktrees found.', dimColor: true }];
     }
-    const actionMessage = getActionMessage(selectedRow, activePath);
+    const lines = [section('Identity')];
     const showFullPath = !compactDetails && selectedRow.shortPath !== selectedRow.path;
     const showTags = !compactDetails;
-    const pullRequestTitle = selectedRow.pullRequest?.kind === 'found' && !compactDetails
-        ? sanitizeInlineText(selectedRow.pullRequest.title)
-        : null;
-    return (_jsxs(Box, { width: width, flexGrow: stacked ? 0 : 1, flexShrink: 1, borderStyle: "round", borderColor: "magenta", flexDirection: "column", paddingX: 1, children: [_jsx(Text, { bold: true, color: "magenta", children: "Selection / Action" }), _jsx(SectionHeader, { label: "Identity" }), _jsxs(Text, { bold: true, color: selectedRow.tags.includes('active') ? 'green' : undefined, wrap: "truncate-end", children: ["Branch: ", sanitizeInlineText(selectedRow.branch)] }), _jsxs(Text, { wrap: "truncate-end", children: ["Path: ", sanitizeInlineText(selectedRow.shortPath)] }), showFullPath ? _jsxs(Text, { wrap: "truncate-end", children: ["Full Path: ", sanitizeInlineText(selectedRow.path)] }) : undefined, _jsxs(Text, { wrap: "truncate-end", children: ["HEAD: ", selectedRow.headSha || '-'] }), showTags ? _jsxs(Text, { wrap: "truncate-end", children: ["Tags: ", formatTags(selectedRow.tags)] }) : undefined, _jsx(SectionHeader, { label: "Git / PR" }), _jsxs(Text, { wrap: "truncate-end", children: ["Upstream: ", formatUpstream(selectedRow)] }), _jsxs(Text, { wrap: "truncate-end", children: ["Status: ", formatWorkingTree(selectedRow)] }), _jsxs(Text, { color: getPullRequestColor(selectedRow), dimColor: selectedRow.pullRequest?.kind === 'found' && selectedRow.pullRequest.state !== 'OPEN', wrap: "truncate-end", children: [getPullRequestLabel(selectedRow), ": ", formatPullRequest(selectedRow)] }), pullRequestTitle ? _jsxs(Text, { dimColor: selectedRow.pullRequest?.kind === 'found' && selectedRow.pullRequest.state !== 'OPEN', wrap: "truncate-end", children: [getPullRequestTitleLabel(selectedRow), ": ", pullRequestTitle] }) : undefined, _jsx(SectionHeader, { label: "Action" }), _jsx(Text, { color: getActionColor(selectedRow), wrap: "truncate-end", children: actionMessage }), _jsx(SectionHeader, { label: "Notes" }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: getNotes(selectedRow) })] }));
+    const pullRequest = projectPullRequest(selectedRow);
+    const pullRequestTitle = pullRequest.kind === 'found' && !compactDetails ? pullRequest.title : null;
+    lines.push({ text: `Branch: ${sanitizeInlineText(selectedRow.branch)}`, bold: true }, { text: `Path: ${sanitizeInlineText(selectedRow.shortPath)}` });
+    if (showFullPath) {
+        lines.push({ text: `Full Path: ${sanitizeInlineText(selectedRow.path)}` });
+    }
+    lines.push({ text: `HEAD: ${selectedRow.headSha || '-'}` });
+    lines.push({ text: `Branch Created: ${formatUtcDateTime(selectedRow.branchCreatedAtMs)}` });
+    if (showTags) {
+        for (const { tag } of getOrderedNonActiveTags(selectedRow.tags)) {
+            lines.push({ text: getTagLabel(tag).toUpperCase(), color: getTagColor(tag) });
+        }
+    }
+    lines.push(divider(), section('Git / PR'), { text: `Upstream: ${formatUpstream(selectedRow)}` }, { text: `Status: ${formatWorkingTree(selectedRow)}` }, {
+        text: `${getPullRequestLabel(pullRequest)}: ${formatPullRequest(selectedRow)}`,
+        color: getPullRequestColorFromProjection(pullRequest),
+        dimColor: getPullRequestDimColor(pullRequest),
+    });
+    if (pullRequestTitle) {
+        lines.push({ text: `${getPullRequestTitleLabel(pullRequest)}: ${pullRequestTitle}`, dimColor: getPullRequestDimColor(pullRequest) });
+    }
+    const actionVariant = getActionVariant(selectedRow, activePath);
+    const noteVariant = projectNote(selectedRow).severity;
+    lines.push(divider(), section('Action'), { text: `${getVariantIcon(actionVariant)} ${getActionMessage(selectedRow, activePath)}`, color: getVariantColor(actionVariant) });
+    if (setupAvailable) {
+        lines.push({ text: 'ℹ Press i to run setup in this worktree.', color: 'blue' });
+    }
+    lines.push(section('Notes'), { text: `${getVariantIcon(noteVariant)} ${getNotes(selectedRow)}`, color: getVariantColor(noteVariant) });
+    return lines;
+}
+export function ActionPanel({ selectedRow, activePath, setupAvailable, stacked, width, height, compactDetails, scrollOffset = 0, }) {
+    const lines = getPanelLines(selectedRow, activePath, setupAvailable, compactDetails ?? false);
+    const viewport = height === undefined ? undefined : sliceListViewport(lines, height - 3, scrollOffset);
+    const contentViewportHeight = viewport?.viewportHeight;
+    const effectiveScrollOffset = viewport?.scrollOffset ?? 0;
+    const visibleLines = viewport?.visibleItems ?? lines;
+    const showScrollbar = viewport !== undefined && lines.length > viewport.viewportHeight;
+    const scrollbarThumbRows = showScrollbar
+        ? getScrollbarThumbRows(lines.length, viewport.viewportHeight, viewport.scrollOffset)
+        : new Set();
+    return (_jsxs(Box, { width: width, height: height, flexGrow: stacked ? 0 : 1, flexShrink: 1, borderStyle: "round", borderColor: "magenta", flexDirection: "column", paddingX: 1, overflow: "hidden", children: [_jsx(Text, { bold: true, color: "magenta", wrap: "truncate-end", children: "Selection / Action" }), _jsx(Box, { height: contentViewportHeight, flexDirection: "column", overflow: "hidden", children: visibleLines.map((line, index) => (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { flexGrow: 1, flexShrink: 1, children: _jsx(Text, { color: line.color, dimColor: line.dimColor, bold: line.bold, wrap: "truncate-end", children: line.text }) }), showScrollbar ? (_jsx(Text, { color: scrollbarThumbRows.has(index) ? 'magenta' : 'gray', dimColor: !scrollbarThumbRows.has(index), children: scrollbarThumbRows.has(index) ? '█' : '│' })) : null] }, `${effectiveScrollOffset + index}-${line.text}`))) })] }));
 }

package/dist/components/ContextBar.d.ts

@@ -1,5 +1,8 @@
 import React from 'react';
 import type { AppStatus } from '../core/runtime.js';
-export declare function ContextBar({ status }: {
+export declare function ContextBar({ status, setupAvailable, editorAvailable, confirmationOpen, }: {
     status: AppStatus;
+    setupAvailable: boolean;
+    editorAvailable: boolean;
+    confirmationOpen: boolean;
 }): React.JSX.Element;

package/dist/components/ContextBar.js

@@ -1,12 +1,45 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
 import { Box, Text } from 'ink';
-const COLOR_BY_KIND = {
+import { Spinner } from '@inkjs/ui';
+const KIND_TO_ICON = {
+    idle: 'ℹ',
+    starting: '⚠',
+    'setting-up': '⚠',
+    running: '✓',
+    stopping: '⚠',
+    error: '✘',
+};
+const KIND_TO_COLOR = {
     idle: 'blue',
     starting: 'yellow',
+    'setting-up': 'yellow',
     running: 'green',
     stopping: 'yellow',
     error: 'red',
 };
-export function ContextBar({ status }) {
-    return (_jsxs(Box, { borderStyle: "round", borderColor: COLOR_BY_KIND[status.kind], flexDirection: "column", paddingX: 1, children: [_jsxs(Text, { color: COLOR_BY_KIND[status.kind], wrap: "truncate-end", children: ["Status: ", status.kind, " \u2014 ", status.message] }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Keys: \u2191\u2193/jk move  g/G first/last  Enter start/switch  s stop  r refresh  q quit" })] }));
+function buildKeyHints(setupAvailable, editorAvailable, confirmationOpen) {
+    if (confirmationOpen) {
+        return [
+            { binding: 'd/y', label: 'Confirm' },
+            { binding: 'Esc/n/q', label: 'Cancel' },
+        ];
+    }
+    const hints = [
+        { binding: '↑↓/jk', label: 'Move' },
+        { binding: 'Enter', label: 'Switch' },
+    ];
+    if (setupAvailable) {
+        hints.push({ binding: 'i', label: 'Setup' });
+    }
+    if (editorAvailable) {
+        hints.push({ binding: 'e', label: 'Editor' });
+    }
+    hints.push({ binding: 'o', label: 'Open PR' }, { binding: 'd', label: 'Delete' }, { binding: 'L', label: 'Logs' }, { binding: 's', label: 'Stop' }, { binding: 'r', label: 'Refresh' }, { binding: '?', label: 'Help' }, { binding: 'q', label: 'Quit' });
+    return hints;
+}
+export function ContextBar({ status, setupAvailable, editorAvailable, confirmationOpen, }) {
+    const isBusy = status.kind === 'setting-up' || status.kind === 'starting' || status.kind === 'stopping';
+    const keyHints = buildKeyHints(setupAvailable, editorAvailable, confirmationOpen);
+    return (_jsxs(Box, { borderStyle: "round", borderColor: KIND_TO_COLOR[status.kind], flexDirection: "column", paddingX: 1, children: [isBusy ? (_jsx(Spinner, { label: `Status: ${status.kind} — ${status.message}` })) : (_jsxs(Text, { color: KIND_TO_COLOR[status.kind], wrap: "truncate-end", children: [KIND_TO_ICON[status.kind], " Status: ", status.kind, " \u2014 ", status.message] })), _jsx(Text, { wrap: "truncate-end", children: keyHints.map((hint, hintIndex) => (_jsxs(React.Fragment, { children: [hintIndex === 0 ? null : _jsx(Text, { dimColor: true, children: " | " }), _jsx(Text, { color: "white", children: hint.binding }), _jsxs(Text, { dimColor: true, children: [" ", hint.label] })] }, hint.binding))) })] }));
 }

package/dist/components/FloatingLogWindow.d.ts

@@ -0,0 +1,7 @@
+import type { AppLogEntry } from '../core/runtime.js';
+export declare function FloatingLogWindow({ logs, width, height, scrollOffset, }: {
+    logs: AppLogEntry[];
+    width: number;
+    height: number;
+    scrollOffset: number;
+}): import("react").JSX.Element;

package/dist/components/FloatingLogWindow.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LogPanel } from './LogPanel.js';
+export function FloatingLogWindow({ logs, width, height, scrollOffset, }) {
+    return (_jsx(LogPanel, { logs: logs, width: width, height: height, scrollOffset: scrollOffset, title: "Logs (*.log \u00B7 tail 120 \u00B7 full screen)" }));
+}

package/dist/components/HelpWindow.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare function HelpWindow({ setupAvailable, editorAvailable, width, height }: {
+    setupAvailable: boolean;
+    editorAvailable: boolean;
+    width: number;
+    height: number;
+}): React.JSX.Element;

package/dist/components/HelpWindow.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+function buildHelpLines(setupAvailable, editorAvailable) {
+    const lines = [
+        { section: 'Movement', binding: '↑↓/jk', description: 'move selection' },
+        { section: 'Movement', binding: 'g/G', description: 'first/last' },
+        { section: 'Scroll', binding: 'Wheel', description: 'pane under cursor' },
+        { section: 'Scroll', binding: 'PageUp/PageDn', description: 'selection page' },
+        { section: 'Logs', binding: 'L', description: 'full-screen logs' },
+        { section: 'Logs', binding: '[/]', description: 'scroll log' },
+        { section: 'Actions', binding: 'Enter', description: 'start/switch worktree' },
+    ];
+    if (setupAvailable) {
+        lines.push({ section: 'Actions', binding: 'i', description: 'setup selected worktree' });
+    }
+    if (editorAvailable) {
+        lines.push({ section: 'Actions', binding: 'e', description: 'open selected worktree in editor' });
+    }
+    lines.push({ section: 'Actions', binding: 'o', description: 'open selected pull request' }, { section: 'Actions', binding: 'd', description: 'arm worktree deletion' }, { section: 'Actions', binding: 's', description: 'stop active session' }, { section: 'Actions', binding: 'r', description: 'refresh' }, { section: 'Actions', binding: 'q', description: 'quit' }, { section: 'Help', binding: 'Esc/q/?', description: 'close help' }, { section: 'Help', binding: 'd/y', description: 'confirm delete after arming' }, { section: 'Help', binding: 'Esc/n/q', description: 'cancel delete confirmation' });
+    return lines;
+}
+export function HelpWindow({ setupAvailable, editorAvailable, width, height }) {
+    let previousSection = '';
+    return (_jsxs(Box, { width: width, height: height, borderStyle: "round", borderColor: "blue", flexDirection: "column", paddingX: 1, children: [_jsx(Text, { bold: true, color: "blue", wrap: "truncate-end", children: "Keyboard Help" }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: "Primary shortcuts are shown in the status footer. Advanced shortcuts live here." }), buildHelpLines(setupAvailable, editorAvailable).map(line => {
+                const section = line.section === previousSection ? '' : line.section;
+                previousSection = line.section;
+                return (_jsxs(Box, { flexDirection: "row", children: [_jsx(Box, { width: 10, children: _jsx(Text, { dimColor: true, wrap: "truncate-end", children: section }) }), _jsx(Box, { width: 16, children: _jsx(Text, { color: "white", wrap: "truncate-end", children: line.binding }) }), _jsx(Text, { dimColor: true, wrap: "truncate-end", children: line.description })] }, `${line.section}-${line.binding}`));
+            })] }));
+}

package/dist/components/LogPanel.d.ts

@@ -0,0 +1,22 @@
+import type { AppLogEntry } from '../core/runtime.js';
+type LogColor = 'black' | 'red' | 'green' | 'yellow' | 'blue' | 'magenta' | 'cyan' | 'white' | 'gray';
+type LineStyle = {
+    color?: LogColor;
+    dimColor?: boolean;
+    bold?: boolean;
+};
+type LineSegment = {
+    text: string;
+} & LineStyle;
+type LineSpec = {
+    segments: LineSegment[];
+};
+export declare function buildLogLines(logs: AppLogEntry[]): LineSpec[];
+export declare function LogPanel({ logs, width, height, scrollOffset, title, }: {
+    logs: AppLogEntry[];
+    width?: number;
+    height?: number;
+    scrollOffset?: number;
+    title?: string;
+}): import("react").JSX.Element;
+export {};