docs: update the upgrade guide

This commit is contained in:
Hans Pagel 2021-01-13 15:49:08 +01:00
parent f44c9773bf
commit 5cba127d78

View File

@ -35,8 +35,6 @@ Were [waiting for Gridsome](https://github.com/gridsome/gridsome/issues/1289)
### Explicitly register the Document, Text and Paragraph extensions
tiptap 1 tried to hide a few required extensions from you with the default setting `useBuiltInExtensions: true`. That setting has been removed and youre required to import all extensions. Be sure to explicitly import at least the [Document](/api/nodes/document), [Paragraph](/api/nodes/paragraph) and [Text](/api/nodes/text) extensions.
TODO: removed dropCursor, enableDropCursor, enableGapCursor
```js
import Document from '@tiptap/extension-document'
import Paragraph from '@tiptap/extension-paragraph'
@ -52,11 +50,13 @@ new Editor({
})
```
And we removed some settings: `dropCursor`, `enableDropCursor`, and `enableGapCursor`. Those are separate extensions now: [`Dropcursor`](/api/extensions/dropcursor) and [`Gapcursor`](/api/extensions/gapcursor). You probably want to load them, but if you dont just ignore me.
### New document type
~~**We renamed the default `Document` type from `doc` to `document`.** To keep it like that, use your own implementation of the `Document` node or migrate the stored JSON to use the new name.~~
### Removed methods
TODO: state()
We removed the `.state()` method. No worries though, its still available through `editor.state`.
### New extension API
In case youve built some custom extensions for your project, youre required to rewrite them to fit the new API. No worries, you can keep a lot of your work though. The `schema`, `commands`, `keys`, `inputRules` and `pasteRules` all work like they did before. Its just different how you register them.
@ -100,6 +100,30 @@ Read more about [all the nifty details building custom extensions](/guide/build-
| --------------- | ----------- |
| ~~`autoFocus`~~ | `autofocus` |
### Renamed commands
All new extensions come with specific commands to set, unset and toggle styles. So instead of `.bold()`, its now `.toggleBold()`. Also, we switched to lowerCamelCase, below are a few examples. Oh, and we renamed `todo_list`, to `taskList`, sorry for that one.
| Old name | New name |
| ------------------------ | ------------------------- |
| ~~`.blockquote()`~~ | `.toggleBlockquote()` |
| ~~`.bold()`~~ | `.toggleBold()` |
| ~~`.bullet_list()`~~ | `.toggleBulletList()` |
| ~~`.code()`~~ | `.toggleCode()` |
| ~~`.code_block()`~~ | `.toggleCodeBlock()` |
| ~~`.hard_break()`~~ | `.toggleHardBreak()` |
| ~~`.heading()`~~ | `.toggleHeading()` |
| ~~`.horizontal_rule()`~~ | `.toggleHorizontalRule()` |
| ~~`.italic()`~~ | `.toggleItalic()` |
| ~~`.link()`~~ | `.toggleLink()` |
| ~~`.ordered_list()`~~ | `.toggleOrderedList()` |
| ~~`.paragraph()`~~ | `.toggleParagraph()` |
| ~~`.redo()`~~ | `.toggleRedo()` |
| ~~`.strike()`~~ | `.toggleStrike()` |
| ~~`.todo_list()`~~ | `.toggleTaskList()` |
| ~~`.underline()`~~ | `.toggleUnderline()` |
| ~~`.undo()`~~ | `.toggleUndo()` |
| … | … |
### Commands can be chained now
Most commands can be combined to one call now. Thats shorter than separate function calls in most cases. Here is an example to make the selected text bold: