Slots

With Slots, you can turn your documents into templates and forms with fields that users can fill.

To let users fill slots while keeping the rest of the document protected, follow Allow filling only.

Slots can hold much more than a short text value: an inline Slot fits inside a sentence, while a block Slot can contain paragraphs, headings, tables and nested Slots supported by your Schema. You can define validation rules for that content and use Content Protection to control who can edit it.

Install

First, contact our team to join the Tiptap Composable Docs pilot program.

Then, configure your package manager by following the private registry guide.

Then, install the package:

npm install @tiptap/core @tiptap/starter-kit @tiptap-pro/extension-slot

import { Editor } from '@tiptap/core'
import StarterKit from '@tiptap/starter-kit'
import { Slot } from '@tiptap-pro/extension-slot'

const editor = new Editor({
  extensions: [StarterKit, Slot],
  content: {
    type: 'doc',
    // Pass a document with slots, or let the user create them
    content: [
      // An example slot
      {
        type: 'blockSlot',
        attrs: {
          id: 'summary',
          config: { label: 'Summary', required: true },
        },
        content: [{ type: 'paragraph' }],
      },
    ],
  },
})

Next steps

Read the quickstart guide to learn how to add slots to your document. Then, set up the document so that users can fill the slots.