UniqueID extension

The UniqueID extension adds unique IDs to all nodes. The extension keeps track of your nodes, even if you split them, merge them, undo/redo changes, crop content, paste content … It just works. Also, you can configure which node types get an unique ID, and which not, and you can customize how those IDs are generated.

Install

npm install @tiptap/extension-unique-id

Settings

attributeName

Name of the attribute that is attached to the HTML tag (will be prefixed with data-).

Default: 'id'

UniqueID.configure({
  attributeName: 'uid',
})

types

All types that should get a unique ID, for example ['heading', 'paragraph']

Default: []

UniqueID.configure({
  types: ['heading', 'paragraph'],
})

generateID

A function that generates and returns a unique ID.

Default: () => uuidv4()

filterTransaction

Ignore some mutations, for example applied from other users through the collaboration plugin.

Default: null

import { isChangeOrigin } from '@tiptap/extension-collaboration'

// Adds support for collaborative editing
UniqueID.configure({
  filterTransaction: (transaction) => !isChangeOrigin(transaction),
})