tiptap/docs/api/extensions/collaboration.md

86 lines
2.8 KiB
Markdown
Raw Normal View History

---
2021-10-16 04:48:57 +08:00
description: Collaborative text editing can be fricking complex, but it doesnt have to be that way.
2021-10-15 03:20:21 +08:00
icon: user-voice-line
---
2020-08-20 21:33:16 +08:00
# Collaboration
2020-12-04 00:23:54 +08:00
[![Version](https://img.shields.io/npm/v/@tiptap/extension-collaboration.svg?label=version)](https://www.npmjs.com/package/@tiptap/extension-collaboration)
[![Downloads](https://img.shields.io/npm/dm/@tiptap/extension-collaboration.svg)](https://npmcharts.com/compare/@tiptap/extension-collaboration?minimal=true)
The Collaboration extension enables you to collaborate with others in a single document. The implementation is based on [Y.js by Kevin Jahns](https://github.com/yjs/yjs), which is the coolest thing to [integrate collaborative editing](/guide/collaborative-editing) in your project.
2020-10-28 23:49:44 +08:00
2020-12-03 23:52:54 +08:00
The history works totally different in a collaborative editing setup. If you undo a change, you dont want to undo changes of other users. To handle that behaviour this extension provides an own `undo` and `redo` command. Dont load the default [`History`](/api/extensions/history) extension together with the Collaboration extension to avoid conflicts.
## Installation
```bash
npm install @tiptap/extension-collaboration yjs y-websocket y-prosemirror
```
## Settings
### document
An initialized Y.js document.
Default: `null`
```js
Collaboration.configure({
document: new Y.Doc(),
})
```
### field
Name of a Y.js fragment, can be changed to sync multiple fields with one Y.js document.
Default: `'default'`
```js
Collaboration.configure({
document: new Y.Doc(),
field: 'title',
})
```
### fragment
A raw Y.js fragment, can be used instead of `document` and `field`.
Default: `null`
```js
Collaboration.configure({
fragment: new Y.Doc().getXmlFragment('body'),
})
```
## Commands
The `Collboration` extension comes with its own history extension. Make sure to disable the default extension, if youre working with the `StarterKit`.
### undo()
Undo the last change.
```js
editor.commands.undo()
```
### redo()
Redo the last change.
```js
editor.commands.redo()
```
## Keyboard shortcuts
| Command | Windows/Linux | macOS |
| ------- | ----------------------------------------------------- | --------------------------------------------- |
| undo() | `Control` `Z` | `Cmd` `Z` |
| redo() | `Shift`&nbsp;`Control`&nbsp;`Z`<br>`Control`&nbsp;`Y` | `Shift`&nbsp;`Cmd`&nbsp;`Z`<br>`Cmd`&nbsp;`Y` |
## Source code
2021-04-21 21:31:11 +08:00
[packages/extension-collaboration/](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-collaboration/)
## Usage
2020-09-27 03:04:33 +08:00
:::warning Public
The content of this editor is shared with other users.
:::
2021-10-19 00:01:47 +08:00
https://embed.tiptap.dev/preview/Extensions/Collaboration?hideSource
https://embed.tiptap.dev/preview/Extensions/Collaboration