Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/bpampuch/pdfmake/llms.txt

Use this file to discover all available pages before exploring further.

pdfmake can automatically build a table of contents by letting you mark headings and other text nodes with a tocItem flag. When the document is rendered, pdfmake collects all tagged items, records which page each one lands on, and fills in the toc node you placed in the content. No separate pass or post-processing is needed.

The toc Node

Place a toc node anywhere in your content array — typically near the beginning, after a cover page. The node contains a toc object with optional configuration:
const docDefinition = {
  content: [
    {
      text: 'Introduction',
      pageBreak: 'after'
    },
    {
      // The TOC node — pdfmake fills this in automatically
      toc: {
        title: { text: 'TABLE OF CONTENTS', style: 'header' },
        numberStyle: { bold: true },
        textStyle: { italics: true },
        textMargin: [0, 0, 0, 0]
      }
    }
  ]
};

toc Configuration Properties

title
object | string
A pdfmake content node rendered as the heading above the TOC entries. Accepts any text node including styles.
numberStyle
object
Inline style overrides applied to the page-number column of each TOC entry. For example, { bold: true }.
textStyle
object
Inline style overrides applied to the text (title) column of each TOC entry. For example, { italics: true }.
textMargin
array
Four-element margin array [left, top, right, bottom] applied to the text column. Defaults to [0, 0, 0, 0].
sortBy
string
Controls the order of TOC entries. Use 'page' (default) to sort by page number, or 'title' to sort alphabetically by the entry text.
sortLocale
string
A BCP 47 locale string (e.g. 'cs', 'de') used when sorting by title. Enables locale-aware collation for non-English content.
outlines
boolean
When true, TOC entries are also added as PDF document outlines (bookmarks in the viewer sidebar).

Marking Items for the TOC

To include a content node in the table of contents, add tocItem: true to it:
{
  text: 'Chapter 1 — Getting Started',
  style: 'header',
  tocItem: true,
  pageBreak: 'before'
}
pdfmake records the text and final page number of every node that has tocItem: true and uses it to populate the nearest toc node.

Styling Individual TOC Entries

Each tocItem node can carry its own per-entry style overrides that apply only to that row in the TOC:
tocStyle
object
Inline text styles applied to this entry’s text column in the TOC (e.g. { italics: true }).
tocMargin
array
Four-element margin for this entry’s text column in the TOC.
tocNumberStyle
object
Inline text styles applied to this entry’s page-number column in the TOC.
{
  text: 'Chapter 1 — Getting Started',
  style: 'header',
  tocItem: true,
  tocStyle: { italics: true },
  tocMargin: [0, 10, 0, 0],
  tocNumberStyle: { italics: true, decoration: 'underline' },
  pageBreak: 'before'
}

Using tocItem on Inline Text

tocItem can be applied to inline text spans nested inside a paragraph. Only the marked span contributes to the TOC — any surrounding text in the same paragraph is ignored.
{
  text: [
    {
      text: 'Subheader 3 - using inline text',
      style: 'subheader',
      tocItem: true   // only this span goes into the TOC
    },
    {
      text: '; and this text not be displayed in ToC',
      italics: true
    }
  ],
  pageBreak: 'before'
}
This lets you tag just the heading portion of a more complex text node without splitting it into a separate paragraph.

Multiple TOCs with Named IDs

You can have more than one table of contents in a single document by giving each toc node an id and tagging content nodes with tocItem: 'id'.
const docDefinition = {
  content: [
    // Figures list
    { toc: { id: 'figures', title: { text: 'LIST OF FIGURES' } } },

    // Tables list
    { toc: { id: 'tables', title: { text: 'LIST OF TABLES' } } },

    // This figure entry only appears in the 'figures' TOC
    {
      text: 'Figure 1 — System Overview',
      tocItem: 'figures'
    },

    // This table entry only appears in the 'tables' TOC
    {
      text: 'Table 1 — Performance Metrics',
      tocItem: 'tables'
    }
  ]
};

Complete Working Example

The following example is taken directly from examples/toc.js in the pdfmake source repository. It demonstrates a document with one TOC, multiple heading levels, per-entry custom styles, and an inline tocItem.
const docDefinition = {
  content: [
    {
      text: 'This is a TOC example. Text elements marked with tocItem: true will be located in the toc. See below.',
      pageBreak: 'after'
    },
    {
      toc: {
        title: { text: 'INDEX', style: 'header' },
        //textMargin: [0, 0, 0, 0],
        //textStyle: {italics: true},
        numberStyle: { bold: true },
        sortBy: 'page', // 'page' (default) or 'title'
        //sortLocale: 'cs', // custom locale to sort
        //outlines: true,
      }
    },
    {
      text: 'This is a header, using header style',
      style: 'header',
      tocItem: true,
      tocStyle: { italics: true },
      tocMargin: [0, 10, 0, 0],
      tocNumberStyle: { italics: true, decoration: 'underline' },
      pageBreak: 'before'
    },
    'Lorem ipsum dolor sit amet...\n\n',
    {
      text: 'Subheader 1 - using subheader style',
      style: 'subheader',
      tocItem: true,
      pageBreak: 'before'
    },
    'Lorem ipsum dolor sit amet...',
    {
      text: 'Subheader 2 - using subheader style',
      style: 'subheader',
      tocItem: true,
      pageBreak: 'before'
    },
    'Lorem ipsum dolor sit amet...\n\n',
    {
      text: [
        {
          text: 'Subheader 3 - using inline text',
          style: 'subheader',
          tocItem: true
        },
        {
          text: '; and this text not be displayed in ToC',
          italics: true
        }
      ],
      pageBreak: 'before'
    },
    'Lorem ipsum dolor sit amet...'
  ],
  styles: {
    header: {
      fontSize: 18,
      bold: true
    },
    subheader: {
      fontSize: 15,
      bold: true
    },
    quote: {
      italics: true
    },
    small: {
      fontSize: 8
    }
  }
};
pdfmake computes the TOC in a two-pass layout. If very long documents cause page numbers to shift during layout, the TOC will still be correct — the final page numbers are filled in after the full layout is complete.

Build docs developers (and LLMs) love