feat(renderer): Minimap (custom overview, wired to settings.minimap)

This commit is contained in:
2026-06-06 08:20:48 +05:30
parent 1ccde4baa3
commit fbaff37505
3 changed files with 62 additions and 1 deletions
@@ -0,0 +1,33 @@
interface Props {
content: string;
scrollRatio?: number; // 0-1, where the viewport is
visibleRatio?: number; // 0-1, what fraction of content is visible
}
export function Minimap({ content, scrollRatio = 0, visibleRatio = 1 }: Props) {
const lines = content.split('\n');
// Compute viewport position in the minimap
const viewportTop = Math.round(scrollRatio * 100);
const viewportHeight = Math.round(visibleRatio * 100);
return (
<div
data-testid="minimap"
className="pointer-events-none absolute right-0 top-0 h-full w-[100px] overflow-hidden border-l border-border bg-card/30 p-1 font-mono text-[6px] leading-[8px] text-muted-foreground"
aria-hidden="true"
>
<pre className="w-full truncate whitespace-pre">
{lines.map((line, i) => (
<div key={i} data-testid="minimap-line">
{line || ' '}
</div>
))}
</pre>
<div
data-testid="minimap-viewport"
className="pointer-events-none absolute left-0 right-0 bg-brand/15"
style={{ top: `${viewportTop}%`, height: `${Math.max(viewportHeight, 5)}%` }}
/>
</div>
);
}