Merge branch 'main' into feature/extension-code-block-lowlight

2021-04-07 22:39:39 +02:00
parent 6720666fc3 7c4c50e520
commit 95f31f48fd
125 changed files with 1230 additions and 1389 deletions
--- a/docs/src/demos/Examples/CollaborativeEditing/index.vue
+++ b/docs/src/demos/Examples/CollaborativeEditing/index.vue
@@ -30,13 +30,9 @@ import TaskItem from '@tiptap/extension-task-item'
 import Highlight from '@tiptap/extension-highlight'
 import * as Y from 'yjs'
 import { WebsocketProvider } from 'y-websocket'
-// import { IndexeddbPersistence } from 'y-indexeddb'
+import { IndexeddbPersistence } from 'y-indexeddb'
 import MenuBar from './MenuBar.vue'

-const CustomTaskItem = TaskItem.extend({
-  content: 'paragraph',
-})
-
 const getRandomElement = list => {
  return list[Math.floor(Math.random() * list.length)]
 }
@@ -70,14 +66,17 @@ export default {

    window.ydoc = ydoc

-    // this.indexdb = new IndexeddbPersistence('tiptap-collaboration-example', ydoc)
+    this.indexdb = new IndexeddbPersistence('tiptap-collaboration-example', ydoc)

    this.editor = new Editor({
      extensions: [
        ...defaultExtensions().filter(extension => extension.config.name !== 'history'),
        Highlight,
        TaskList,
-        CustomTaskItem,
+        TaskItem,
+        Collaboration.configure({
+          document: ydoc,
+        }),
        CollaborationCursor.configure({
          provider: this.provider,
          user: this.currentUser,
@@ -85,9 +84,6 @@ export default {
            this.users = users
          },
        }),
-        Collaboration.configure({
-          document: ydoc,
-        }),
      ],
    })

@@ -327,7 +323,7 @@ export default {
      display: flex;
      align-items: center;

-      > input {
+      > label {
        flex: 0 0 auto;
        margin-right: 0.5rem;
      }
--- a/docs/src/demos/Examples/Tasks/index.vue
+++ b/docs/src/demos/Examples/Tasks/index.vue
@@ -69,7 +69,7 @@ ul[data-type="taskList"] {
    display: flex;
    align-items: center;

-    > input {
+    > label {
      flex: 0 0 auto;
      margin-right: 0.5rem;
    }
--- a/docs/src/demos/Experiments/GlobalDragHandle/index.vue
+++ b/docs/src/demos/Experiments/GlobalDragHandle/index.vue
@@ -5,7 +5,8 @@
 </template>

 <script>
-import { Editor, EditorContent, defaultExtensions } from '@tiptap/vue-starter-kit'
+import { Editor, EditorContent } from '@tiptap/vue-2'
+import { defaultExtensions } from '@tiptap/starter-kit'
 import DragHandle from './DragHandle.js'

 export default {
--- a/docs/src/demos/Experiments/MultipleEditors/index.vue
+++ b/docs/src/demos/Experiments/MultipleEditors/index.vue
@@ -158,7 +158,7 @@ export default {
        display: flex;
        align-items: center;

-        > input {
+        > label {
          flex: 0 0 auto;
          margin-right: 0.5rem;
        }
--- a/docs/src/demos/Extensions/CollaborationCursor/index.vue
+++ b/docs/src/demos/Extensions/CollaborationCursor/index.vue
@@ -33,6 +33,9 @@ export default {
        Document,
        Paragraph,
        Text,
+        Collaboration.configure({
+          document: ydoc,
+        }),
        CollaborationCursor.configure({
          provider: this.provider,
          user: {
@@ -40,9 +43,6 @@ export default {
            color: '#f783ac',
          },
        }),
-        Collaboration.configure({
-          document: ydoc,
-        }),
      ],
    })
  },
--- a/docs/src/demos/Guide/Content/ReadOnly/index.spec.js
+++ b/docs/src/demos/Guide/Content/ReadOnly/index.spec.js
@@ -6,7 +6,7 @@ context('/demos/Guide/Content/ReadOnly', () => {
  it('should be read-only', () => {
    cy.get('.ProseMirror').then(([{ editor }]) => {
      editor.setEditable(false)
-      editor.commands.insertText('Edited: ')
+      editor.commands.insertContent('Edited: ')

      cy.get('.ProseMirror p:first').should('not.contain', 'Edited: ')
    })
@@ -15,7 +15,7 @@ context('/demos/Guide/Content/ReadOnly', () => {
  it('should be editable', () => {
    cy.get('.ProseMirror').then(([{ editor }]) => {
      editor.setEditable(true)
-      editor.commands.insertText('Edited: ')
+      editor.commands.insertContent('Edited: ')

      cy.get('.ProseMirror p:first').should('contain', 'Edited: ')
    })
--- a/docs/src/demos/Guide/NodeViews/JavaScriptContent/Extension.js
+++ b/docs/src/demos/Guide/NodeViews/JavaScriptContent/Extension.js
@@ -16,7 +16,7 @@ export default Node.create({
  },

  renderHTML({ HTMLAttributes }) {
-    return ['node-view', mergeAttributes(HTMLAttributes)]
+    return ['node-view', mergeAttributes(HTMLAttributes), 0]
  },

  addNodeView() {
--- a/docs/src/demos/Guide/NodeViews/ReactComponentContent/Extension.js
+++ b/docs/src/demos/Guide/NodeViews/ReactComponentContent/Extension.js
@@ -18,7 +18,7 @@ export default Node.create({
  },

  renderHTML({ HTMLAttributes }) {
-    return ['react-component', mergeAttributes(HTMLAttributes)]
+    return ['react-component', mergeAttributes(HTMLAttributes), 0]
  },

  addNodeView() {
--- a/docs/src/demos/Guide/NodeViews/VueComponentContent/Extension.js
+++ b/docs/src/demos/Guide/NodeViews/VueComponentContent/Extension.js
@@ -18,7 +18,7 @@ export default Node.create({
  },

  renderHTML({ HTMLAttributes }) {
-    return ['vue-component', mergeAttributes(HTMLAttributes)]
+    return ['vue-component', mergeAttributes(HTMLAttributes), 0]
  },

  addNodeView() {
--- a/docs/src/demos/Marks/Link/index.vue
+++ b/docs/src/demos/Marks/Link/index.vue
@@ -16,6 +16,7 @@ import Document from '@tiptap/extension-document'
 import Paragraph from '@tiptap/extension-paragraph'
 import Text from '@tiptap/extension-text'
 import Link from '@tiptap/extension-link'
+import Bold from '@tiptap/extension-bold'

 export default {
  components: {
@@ -34,11 +35,12 @@ export default {
        Document,
        Paragraph,
        Text,
+        Bold,
        Link,
      ],
      content: `
        <p>
-          Wow, this editor has support for links to the whole <a href="https://en.wikipedia.org/wiki/World_Wide_Web">world wide web</a>. We tested a lot of URLs and I think you can add *every URL* you want. Isn’t that cool? Let’s try <a href="https://statamic.com/">another one!</a> Yep, seems to work.
+          Wow, this editor has support for links to the whole <strong><a href="https://en.wikipedia.org/wiki/World_Wide_Web">world wide web</a></strong>. We tested a lot of URLs and I think you can add *every URL* you want. Isn’t that cool? Let’s try <a href="https://statamic.com/">another one!</a> Yep, seems to work.
        </p>
        <p>
          By default every link will get a \`rel="noopener noreferrer nofollow"\` attribute. It’s configurable though.
--- a/docs/src/demos/Nodes/Emoji/index.vue
+++ b/docs/src/demos/Nodes/Emoji/index.vue
@@ -1,21 +1,21 @@
 <template>
  <div v-if="editor">
-    <button @click="editor.chain().focus(). insertText('✨').run()">
+    <button @click="editor.chain().focus().insertContent('✨').run()">
      ✨
    </button>
-    <button @click="editor.chain().focus(). insertText('😅').run()">
+    <button @click="editor.chain().focus().insertContent('😅').run()">
      😅
    </button>
-    <button @click="editor.chain().focus(). insertText('🎉').run()">
+    <button @click="editor.chain().focus().insertContent('🎉').run()">
      🎉
    </button>
-    <button @click="editor.chain().focus(). insertText('💖').run()">
+    <button @click="editor.chain().focus().insertContent('💖').run()">
      💖
    </button>
-    <button @click="editor.chain().focus(). insertText('👀').run()">
+    <button @click="editor.chain().focus().insertContent('👀').run()">
      👀
    </button>
-    <button @click="editor.chain().focus(). insertText('👍️').run()">
+    <button @click="editor.chain().focus().insertContent('👍️').run()">
      👍️
    </button>
    <editor-content :editor="editor" />
--- a/docs/src/demos/Nodes/TaskItem/index.vue
+++ b/docs/src/demos/Nodes/TaskItem/index.vue
@@ -56,7 +56,7 @@ ul[data-type="taskList"] {
    display: flex;
    align-items: center;

-    > input {
+    > label {
      flex: 0 0 auto;
      margin-right: 0.5rem;
    }
--- a/docs/src/demos/Nodes/TaskList/index.vue
+++ b/docs/src/demos/Nodes/TaskList/index.vue
@@ -60,7 +60,7 @@ ul[data-type="taskList"] {
    display: flex;
    align-items: center;

-    > input {
+    > label {
      flex: 0 0 auto;
      margin-right: 0.5rem;
    }