Skip to content
ComPDF
Guides

Outlines

An outline is a structured navigation tool for PDF documents, typically displayed in a sidebar or panel of the document reader. It can be automatically generated based on headings and section information in the document, or manually edited and adjusted. Outlines present document content in a hierarchical structure, helping users quickly locate and browse, enabling convenient navigation between different parts of the document.

Get Outlines

tsx
const outlineRoot = await pdfReaderRef?.current?._pdfDocument.getOutlineRoot();

Add Outline

tsx
const outlineRoot = await pdfReaderRef?.current?._pdfDocument.getOutlineRoot();
if (outlineRoot == null){
  outlineRoot = await pdfReaderRef?.current?._pdfDocument.newOutlineRoot();
}

const result = await pdfReaderRef?.current?._pdfDocument.addOutline(
     outlineRoot.uuid,
     title: 'New Outline',
     insertIndex: 0,
     pageIndex: 0
   );

Edit Outline

tsx
await pdfReaderRef.current?._pdfDocument.updateOutline(outline.uuid, 'Chapter 1', pageIndex);

Delete Outline

tsx
await pdfReaderRef.current?._pdfDocument.removeOutline(outline.uuid);

Move Outline

The moveOutline method is used to relocate an existing outline node within the document's outline tree. This method moves the target node to a new parent node and inserts it at the position specified by insertIndex, thereby enabling hierarchy changes and sibling order adjustments.

tsx
const result = await pdfReaderRef.current?._pdfDocument.moveOutline(
  outlineToMove,          // The outline node to move
  targetParentOutline,    // The new parent node. After moving, outline will exist as its child node
  0                       // The insert position in the parent node's child list, -1 means append to the end
);