add content to the collaboration cursor extension

This commit is contained in:
Hans Pagel
2020-11-05 21:57:25 +01:00
parent 810f3d6b6d
commit f946954e91
8 changed files with 24 additions and 17 deletions

View File

@@ -1,5 +1,5 @@
context('/api/extensions/collaboration', () => { context('/api/extensions/collaboration-cursor', () => {
before(() => { before(() => {
cy.visit('/api/extensions/collaboration') cy.visit('/api/extensions/collaboration-cursor')
}) })
}) })

View File

@@ -1,6 +1,6 @@
context('/examples/focus', () => { context('/api/extensions/focus', () => {
before(() => { before(() => {
cy.visit('/examples/focus') cy.visit('/api/extensions/focus')
}) })
it('should have class', () => { it('should have class', () => {

View File

@@ -1,7 +1,14 @@
# Collaboration Cursor # Collaboration Cursor
This extension adds information about all connected users (like their name and a specified color), their current cursor position and their text selection (if theres one).
:::premium Premium Extension Open this page in multiple browser windows to test it.
Using this in production requires a **tiptap pro** license. [Read more](/sponsor)
:::premium 💖 Pro Extension
We kindly ask you to sponsor us, before using this extension in production. [Read more](/sponsor)
:::
::: warning Use with Collaboration
This extension requires the [`Collaboration`](/api/extensions/collaboration) extension.
::: :::
## Installation ## Installation
@@ -31,4 +38,4 @@ yarn add @tiptap/extension-collaboration-cursor
:::warning Public :::warning Public
The content of this editor is shared with other users. The content of this editor is shared with other users.
::: :::
<demo name="Extensions/CollaborationCursor" highlight="" /> <demo name="Extensions/CollaborationCursor" highlight="11,48-52" />

View File

@@ -1,8 +1,8 @@
# Collaboration # Collaboration
The Collaboration extension enables you to collaborate with others on one 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. The Collaboration extension enables you to collaborate with others on one 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.
:::premium Premium Extension :::premium Pro Extension
Using this in production requires a **tiptap pro** license. [Read more](/sponsor) We kindly ask you to sponsor us, before using this extension in production. [Read more](/sponsor)
::: :::
## Installation ## Installation
@@ -33,4 +33,4 @@ yarn add @tiptap/extension-collaboration yjs y-webrtc
:::warning Public :::warning Public
The content of this editor is shared with other users. The content of this editor is shared with other users.
::: :::
<demo name="Extensions/Collaboration" highlight="" /> <demo name="Extensions/Collaboration" highlight="10-12,30-32,43-46,53" />

View File

@@ -1,5 +1,5 @@
# Dropcursor # Dropcursor
This extension loads the [ProseMirror Gapcursor plugin](https://github.com/ProseMirror/prosemirror-gapcursor) by Marijn Haverbeke, which adds a gap for the cursor in places that dont allow regular selection. For example, after a table at the end of a document. This extension loads the [ProseMirror Dropcursor plugin](https://github.com/ProseMirror/prosemirror-dropcursor) by Marijn Haverbeke, which shows a cursor at the drop position when something is dragged over the editor.
Note that tiptap is renderless, but the dropcursor needs CSS for its appearance. The default CSS is added to the usage example below. Note that tiptap is renderless, but the dropcursor needs CSS for its appearance. The default CSS is added to the usage example below.
@@ -16,4 +16,4 @@ yarn add @tiptap/extension-dropcursor
[packages/extension-dropcursor/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-dropcursor/) [packages/extension-dropcursor/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-dropcursor/)
## Usage ## Usage
<demo name="Extensions/Dropcursor" highlight="" /> <demo name="Extensions/Dropcursor" highlight="12,33" />

View File

@@ -1,4 +1,7 @@
# Focus # Focus
The Focus extension adds a CSS class to focused nodes. By default it adds `.has-class`, but you can change that.
Note that its only a class, the styling is totally up to you. The usage example below has some CSS for that class.
## Installation ## Installation
```bash ```bash

View File

@@ -1,7 +1,7 @@
# Collaborative editing # Collaborative editing
:::premium Requires Premium Extensions :::premium Requires pro extensions
Using this example in production requires a **tiptap pro** license. [Read more](/sponsor) We kindly ask you to sponsor us, before using this example in production. [Read more](/sponsor)
::: :::
This example shows how you can use tiptap to let different users collaboratively work on the same text in real-time. This example shows how you can use tiptap to let different users collaboratively work on the same text in real-time.

View File

@@ -16,7 +16,6 @@
link: /examples/basic link: /examples/basic
- title: Collaborative editing - title: Collaborative editing
link: /examples/collaborative-editing link: /examples/collaborative-editing
premium: true
- title: Markdown shortcuts - title: Markdown shortcuts
link: /examples/markdown-shortcuts link: /examples/markdown-shortcuts
# - title: Menu Bubble # - title: Menu Bubble
@@ -163,13 +162,11 @@
premium: true premium: true
- title: CollaborationCursor - title: CollaborationCursor
link: /api/extensions/collaboration-cursor link: /api/extensions/collaboration-cursor
draft: true
premium: true premium: true
- title: Dropcursor - title: Dropcursor
link: /api/extensions/dropcursor link: /api/extensions/dropcursor
- title: Focus - title: Focus
link: /api/extensions/focus link: /api/extensions/focus
draft: true
- title: Gapcursor - title: Gapcursor
link: /api/extensions/gapcursor link: /api/extensions/gapcursor
- title: History - title: History