Minimap

Anatomy

<Minimap.Root width={110}>
	<Minimap.Viewport />
	<Minimap.Markers find annotations sections />
</Minimap.Root>

<Minimap.Root variant="heatmap" width={16}>
	<Minimap.Heatmap find annotations />
	<Minimap.Viewport />
</Minimap.Root>

<Minimap.Root width={110}>
	<Minimap.Viewport />
	<Minimap.Markers find annotations sections />
</Minimap.Root>

<Minimap.Root variant="heatmap" width={16}>
	<Minimap.Heatmap find annotations />
	<Minimap.Viewport />
</Minimap.Root>

Variants

`variant`	Strip shows
`'pages'` (default)	Bitmap previews; pages shorter than `minPreviewHeight` (36 px) become numbered blocks, since tiny previews are unreadable
`'blocks'`	Plain page blocks with page numbers
`'text'`	The document’s structure drawn from the text index: lines, headings, figures
`'spine'`	Coloured section bands with labels (needs `Paper.Root`)
`'heatmap'`	No pages: only markers, or a density `Minimap.Heatmap`

Minimap.Heatmap bins find hits, annotations or your own items along the document (bin, color) — a quick way to see where a term or the notes cluster.

Usage

mode="scroll" (default): pages keep the strip width and the strip scrolls in proportion with the document. mode="fit": the whole document shrinks to the strip.
pages={false}: no previews — a slim scrollbar with markers.
Click to jump; drag the viewport (or anywhere) to scrub. wheel="document" (default) scrolls the document from the strip; wheel="strip" scrolls the strip itself on long documents.
Keyboard: the strip is focusable — ↑ / ↓ step, PageUp / PageDown / Space move a screen, Home / End jump to the ends.
Minimap.Markers takes items ({ page, y | fraction, height?, color?, kind?, label? }) and adds find hits, annotations and section starts from the surrounding roots.
MinimapState exposes the geometry for fully custom renderings.

API reference

`Minimap.Root`

Renders a <div> (or your element via child) and accepts its HTML attributes.

Prop	Type	Default
`width` Strip width in CSS px. Default 80.	`number`	`80`
`mode` 'scroll' (code-editor style, default) or 'fit' (whole document shrunk to the strip).	`'scroll' \| 'fit'`	`'scroll'`
`gap`	`number`	`4`
`variant` Look of the strip: - 'pages': bitmap previews (blocks when pages get too small to read), - 'blocks': plain page blocks with numbers, - 'text': structure drawn from the text index (lines, headings, figures), - 'spine': colored section bands with labels (needs Paper.Root), - 'heatmap': no pages, only markers / Minimap.Heatmap. Default 'pages'.	`MinimapVariant`	`'pages'`
`pages` Draw page boxes at all. Default true (false = markers-only scrollbar).	`boolean`	`true`
`wheel` Wheel over the strip scrolls the document (default) or the strip itself.	`'document' \| 'strip'`	`'document'`
`minPreviewHeight` Below this page height (px) bitmap previews become blocks. Default 36.	`number`	`36`
`minimap` bindable	`MinimapState`	—

Snippet prop	Type
`minimap`	`MinimapState`

Data attributes data-activedata-currentdata-draggingdata-indexdata-kinddata-modedata-partdata-pdf-minimapdata-pdf-minimap-banddata-pdf-minimap-pagedata-pdf-minimap-trackdata-previewsdata-scrollabledata-variant

`Minimap.Viewport`

Renders a <div> (or your element via child) and accepts its HTML attributes.

No props of its own besides ref, child and children.

Snippet prop	Type
`dragging`	`boolean`

Data attributes data-draggingdata-pdf-minimap-viewport

`Minimap.Markers`

Renders a <div> (or your element via child) and accepts its HTML attributes.

Prop	Type	Default
`items`	`MinimapMarker[]`	`[]`
`find` Add find matches (needs Find.Root).	`boolean`	`false`
`annotations` Add annotations (needs Annotations.Root).	`boolean`	`false`
`sections` Add section headings (needs Paper.Root).	`boolean`	`false`

Data attributes data-kinddata-pdf-minimap-markerdata-pdf-minimap-markers

`Minimap.Heatmap`

Renders a <div> (or your element via child) and accepts its HTML attributes.

Prop	Type	Default
`bin` Bin height in px. Default 6.	`number`	`6`
`find`	`boolean`	`true`
`annotations`	`boolean`	`true`
`items`	`MinimapMarker[]`	`[]`
`color` CSS color of the hottest bin.	`string`	`'var(--pdf-accent, rgb(37 99 235))'`

Data attributes data-pdf-minimap-heatdata-pdf-minimap-heatmap