Components

Note

The <Note> component creates a PDF annotation — a sticky note or comment attached to a specific position on the page. Notes appear as clickable icons in PDF viewers.

Props

PropTypeDefaultDescription
styleStylePosition and size of the note icon on the page.

Usage

vue
<template>
  <Document>
    <Page size="A4">
      <Text :style="{ fontSize: 14, marginBottom: 20 }">
        This paragraph has a note attached about the content.
      </Text>

      <Note :style="{ position: 'absolute', left: 20, top: 100 }">
        This is a reviewer comment about the paragraph above.
      </Note>
    </Page>
  </Document>
</template>
Not all PDF viewers display annotations the same way. For maximum compatibility, use notes sparingly and provide the note text as child content.