improve new extensions

docs/src/demos/Api/Schema/GenerateHTML/index.vue

@@ -27,9 +27,9 @@ export default {
 
   mounted() {
     this.html = generateHTML(this.json, [
-      Document(),
-      Paragraph(),
-      Text(),
+      Document,
+      Paragraph,
+      Text,
     ])
   },
 }

docs/src/demos/Examples/CollaborativeEditing/index.vue

@@ -135,11 +135,11 @@ export default {
     this.editor = new Editor({
       extensions: [
         ...defaultExtensions(),
-        Collaboration({
+        Collaboration.set({
           provider: this.provider,
           type: this.type,
         }),
-        CollaborationCursor({
+        CollaborationCursor.set({
           provider: this.provider,
           name: this.name,
           color: this.color,

docs/src/demos/Examples/Formatting/index.vue

@@ -61,16 +61,16 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Heading({
+        Document,
+        Paragraph,
+        Text,
+        Heading.set({
           level: [1, 2, 3],
         }),
-        Bold(),
-        Italic(),
-        TextAlign(),
-        HardBreak(),
+        Bold,
+        Italic,
+        TextAlign,
+        HardBreak,
       ],
       content: `
         <h3>Girls Just Want to Have Fun (Cyndi Lauper)</h2>

docs/src/demos/Examples/Links/index.vue

@@ -32,10 +32,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Link(),
+        Document,
+        Paragraph,
+        Text,
+        Link,
       ],
       content: `
         <p>

docs/src/demos/Examples/MarkdownShortcuts/index.vue

@@ -37,7 +37,7 @@ export default {
       `,
       extensions: [
         ...defaultExtensions(),
-        Highlight(),
+        Highlight,
       ],
     })
   },

docs/src/demos/Examples/Minimalist/index.vue

@@ -22,9 +22,9 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
+        Document,
+        Paragraph,
+        Text,
       ],
       content: `
         <p>

docs/src/demos/Examples/TodoApp/index.vue

@@ -35,11 +35,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        CustomDocument(),
-        Paragraph(),
-        Text(),
-        TaskList(),
-        CustomTaskItem(),
+        CustomDocument,
+        Paragraph,
+        Text,
+        TaskList,
+        CustomTaskItem,
       ],
       content: `
         <ul data-type="taskList">

docs/src/demos/ExtensionConfiguration/index.vue

@@ -26,10 +26,10 @@ export default {
     this.editor = new Editor({
       content: '<p>I’m running tiptap with Vue.js. This demo is interactive, try to edit the text.</p>',
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Bold(),
+        Document,
+        Paragraph,
+        Text,
+        Bold,
       ],
     })
   },

docs/src/demos/Extensions/Collaboration/index.vue

@@ -37,10 +37,10 @@ export default {
       //   <p>Example Text</p>
       // `,
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Collaboration({
+        Document,
+        Paragraph,
+        Text,
+        Collaboration.set({
           provider: this.provider,
           type: this.type,
         }),

docs/src/demos/Extensions/CollaborationCursor/index.vue

@@ -38,14 +38,14 @@ export default {
       //   <p>Example Text</p>
       // `,
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Collaboration({
+        Document,
+        Paragraph,
+        Text,
+        Collaboration.set({
           provider: this.provider,
           type: this.type,
         }),
-        CollaborationCursor({
+        CollaborationCursor.set({
           provider: this.provider,
           name: 'Cyndi Lauper',
           color: '#f783ac',

docs/src/demos/Extensions/Dropcursor/index.vue

@@ -26,11 +26,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Image(),
-        Dropcursor(),
+        Document,
+        Paragraph,
+        Text,
+        Image,
+        Dropcursor,
       ],
       content: `
         <p>Try to drag around the image. While you drag, the editor should show a decoration under your cursor. The so called dropcursor.</p>

docs/src/demos/Extensions/Focus/index.vue

@@ -28,16 +28,16 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Focus({
+        Document,
+        Paragraph,
+        Text,
+        Focus.set({
           className: 'has-focus',
           nested: true,
         }),
-        Code(),
-        BulletList(),
-        ListItem(),
+        Code,
+        BulletList,
+        ListItem,
       ],
       autoFocus: true,
       content: `

docs/src/demos/Extensions/FontFamily/index.vue

@@ -46,11 +46,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        TextStyle(),
-        FontFamily(),
+        Document,
+        Paragraph,
+        Text,
+        TextStyle,
+        FontFamily,
       ],
       content: `
         <p><span style="font-family: Inter">Did you know that Inter is a really nice font for interfaces?</span></p>

docs/src/demos/Extensions/Gapcursor/index.vue

@@ -26,11 +26,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Image(),
-        Gapcursor(),
+        Document,
+        Paragraph,
+        Text,
+        Image,
+        Gapcursor,
       ],
       content: `
         <p>Try to set the cursor behind the image with your arrow keys! You should see big blinking cursor right from the image. This is the gapcursor.</p>

docs/src/demos/Extensions/History/index.vue

@@ -33,10 +33,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        History(),
+        Document,
+        Paragraph,
+        Text,
+        History,
       ],
       content: `
         <p>

docs/src/demos/Extensions/TextAlign/index.vue

@@ -42,11 +42,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Heading(),
-        TextAlign(),
+        Document,
+        Paragraph,
+        Text,
+        Heading,
+        TextAlign,
       ],
       content: `
         <h2>Heading</h2>

docs/src/demos/Extensions/Typography/index.vue

@@ -25,10 +25,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Typography(),
+        Document,
+        Paragraph,
+        Text,
+        Typography,
       ],
       content: `
         <p>“I have been suffering from Typomania all my life, a sickness that is incurable but not lethal.”</p>

docs/src/demos/Guide/BuildYourEditor/index.vue

@@ -55,15 +55,15 @@ export default {
     this.editor = new Editor({
       content: '<h2>Hey there!</h2><p>This editor is based on Prosemirror, fully extendable and headless. You can easily add custom nodes as Vue components.</p>',
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        CodeBlock(),
-        History(),
-        Bold(),
-        Italic(),
-        Code(),
-        Heading(),
+        Document,
+        Paragraph,
+        Text,
+        CodeBlock,
+        History,
+        Bold,
+        Italic,
+        Code,
+        Heading,
       ],
     })
   },

docs/src/demos/Marks/Bold/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Bold(),
+        Document,
+        Paragraph,
+        Text,
+        Bold,
       ],
       content: `
         <p>This isn’t bold.</p>

docs/src/demos/Marks/Code/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Code(),
+        Document,
+        Paragraph,
+        Text,
+        Code,
       ],
       content: `
         <p>This isn’t code.</p>

docs/src/demos/Marks/Highlight/index.vue

@@ -61,10 +61,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Highlight(),
+        Document,
+        Paragraph,
+        Text,
+        Highlight,
       ],
       content: `
           <p>This isn’t highlighted.</s></p>

docs/src/demos/Marks/Italic/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Italic(),
+        Document,
+        Paragraph,
+        Text,
+        Italic,
       ],
       content: `
         <p>This isn’t italic.</p>

docs/src/demos/Marks/Link/index.vue

@@ -32,10 +32,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Link(),
+        Document,
+        Paragraph,
+        Text,
+        Link,
       ],
       content: `
         <p>

docs/src/demos/Marks/Strike/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Strike(),
+        Document,
+        Paragraph,
+        Text,
+        Strike,
       ],
       content: `
           <p>This isn’t striked through.</s></p>

docs/src/demos/Marks/TextStyle/index.vue

@@ -26,10 +26,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        TextStyle(),
+        Document,
+        Paragraph,
+        Text,
+        TextStyle,
       ],
       content: `
         <p><span>This has a &lt;span&gt; tag without a style attribute, so it’s thrown away.</span></p>

docs/src/demos/Marks/Underline/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Underline(),
+        Document,
+        Paragraph,
+        Text,
+        Underline,
       ],
       content: `
         <p>There is no underline here.</p>

docs/src/demos/Nodes/Blockquote/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Blockquote(),
+        Document,
+        Paragraph,
+        Text,
+        Blockquote,
       ],
       content: `
           <blockquote>

docs/src/demos/Nodes/BulletList/index.vue

@@ -31,11 +31,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        BulletList(),
-        ListItem(),
+        Document,
+        Paragraph,
+        Text,
+        BulletList,
+        ListItem,
       ],
       content: `
         <ul>

docs/src/demos/Nodes/CodeBlock/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        CodeBlock(),
+        Document,
+        Paragraph,
+        Text,
+        CodeBlock,
       ],
       content: `
         <p>

docs/src/demos/Nodes/Document/index.vue

@@ -25,9 +25,9 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
+        Document,
+        Paragraph,
+        Text,
       ],
       content: `
         <p>The Document extension is required. Though, you can write your own implementation, e. g. to give it custom name.</p>

docs/src/demos/Nodes/HardBreak/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        HardBreak(),
+        Document,
+        Paragraph,
+        Text,
+        HardBreak,
       ],
       content: `
         <p>

docs/src/demos/Nodes/Heading/index.vue

@@ -36,10 +36,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Heading({
+        Document,
+        Paragraph,
+        Text,
+        Heading.set({
           levels: [1, 2, 3],
         }),
       ],

docs/src/demos/Nodes/HorizontalRule/index.vue

@@ -30,10 +30,10 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        HorizontalRule(),
+        Document,
+        Paragraph,
+        Text,
+        HorizontalRule,
       ],
       content: `
         <p>This is a paragraph.</p>

docs/src/demos/Nodes/Image/index.vue

@@ -38,11 +38,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        Image(),
-        Dropcursor(),
+        Document,
+        Paragraph,
+        Text,
+        Image,
+        Dropcursor,
       ],
       content: `
         <p>This is a basic example of implementing images. Drag to re-order.</p>

docs/src/demos/Nodes/ListItem/index.vue

@@ -35,12 +35,12 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        BulletList(),
-        OrderedList(),
-        ListItem(),
+        Document,
+        Paragraph,
+        Text,
+        BulletList,
+        OrderedList,
+        ListItem,
       ],
       content: `
         <p>

docs/src/demos/Nodes/OrderedList/index.vue

@@ -31,11 +31,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        OrderedList(),
-        ListItem(),
+        Document,
+        Paragraph,
+        Text,
+        OrderedList,
+        ListItem,
       ],
       content: `
         <ol>

docs/src/demos/Nodes/Paragraph/index.vue

@@ -25,9 +25,9 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
+        Document,
+        Paragraph,
+        Text,
       ],
       content: `
         <p>The Paragraph extension is not required, but it’s very likely you want to use it. It’s needed to write paragraphs of text. 🤓</p>

docs/src/demos/Nodes/TaskItem/index.vue

@@ -27,11 +27,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        TaskList(),
-        TaskItem(),
+        Document,
+        Paragraph,
+        Text,
+        TaskList,
+        TaskItem,
       ],
       content: `
         <ul data-type="task_list">

docs/src/demos/Nodes/TaskList/index.vue

@@ -31,11 +31,11 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
-        TaskList(),
-        TaskItem(),
+        Document,
+        Paragraph,
+        Text,
+        TaskList,
+        TaskItem,
       ],
       content: `
         <ul data-type="task_list">

docs/src/demos/Nodes/Text/index.vue

@@ -25,9 +25,9 @@ export default {
   mounted() {
     this.editor = new Editor({
       extensions: [
-        Document(),
-        Paragraph(),
-        Text(),
+        Document,
+        Paragraph,
+        Text,
       ],
       content: `
         <p>The Text extension is required, at least if you want to have text in your text editor and that’s very likely.</p>