List Keymap extension

The List Keymap extension modifies the default ProseMirror and Tiptap behavior. Without this extension, pressing backspace at the start of a list item keeps the list item content on the same line. With the List Keymap, the content is lifted into the list item above.

Install

npm install @tiptap/extension-list

And import it in your editor:

import { Editor } from '@tiptap/core'
import { ListKeymap } from '@tiptap/extension-list'

new Editor({
  extensions: [ListKeymap],
})

This extension is installed by default with the ListKit extension, so you don’t need to install it separately.

import { Editor } from '@tiptap/core'
import { ListKit } from '@tiptap/extension-list-kit'

new Editor({
  extensions: [ListKit],
})

Settings

listTypes

An array of list items and their parent wrapper node types.

ListKeymap.configure({
  listTypes: [
    {
      itemName: 'taskItem',
      wrapperNames: ['customTaskList'],
    },
  ],
})

Default value:

[
  {
    "itemName": "listItem",
    "wrapperNames": ["bulletList", "orderedList"]
  },
  {
    "itemName": "taskItem",
    "wrapperNames": ["taskList"]
  }
]

Source code

packages/extension-list/src/keymap/

Minimal Install

import { Editor } from '@tiptap/core'
import { ListKeymap } from '@tiptap/extension-list/keymap'

new Editor({
  extensions: [ListKeymap],
})