UniqueID

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.

Installation

Pro Extension

All Tiptap Pro extensions require access to our private registry, set this up first.

Once done, you can install the extension from our private registry:

npm install @tiptap-pro/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/collaboration'

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

Usage